You may have noticed the live demo site for Preferential showcases a portfolio that looks great when you want to display projects that you have done, whether for a client, or for yourself. The portfolio is not built into the theme for a very good reason…if you ever change to a new theme, you can keep your portfolio because it’s not part of the theme. In this case, the porfolio is part of the Jetpack plugin. To show you what the portfolio looks like, or at least what I did for the live demo site, you can see it here: Portfolio Demo The first thing you need is Jetpack, so if this is not installed, you need to install it so that we can activate one of the modules in it called “Custom Content Type“. Create Your First Portfolio Project and Portfolio Items Go to Jetpack >> Settings >> then… read more
Setup Tutorials for Preferential
Welcome to the Setup Tutorials for Preferential. These are the standard guidelines to help you install, configure, and customize your newly downloaded theme. If you have any requests for additional tutorials relating to this theme, please contact me and I will review your suggestions. These tutorials are also based on the assumption you have a basic understanding of how WordPress works.
By default, WordPress will show a widget on every page that the widget position exists on. In most cases when making a website, you don’t want that widget to show on every single page, so the only way to manage where and what pages it should be on is to use a plugin. You have a few options available: Jetpack – Has a Widget Visibility feature that adds the settings at the bottom of every widget Display Widgets – A plugin that lets you show widgets on select pages. It also adds the settings to each widget in the admin. Dynamic Widgets – A plugin that offers extensive options but does come with a learning curve, albeit very powerful features. Preferential uses Jetpack on the live demo site and I enabled the Widget Visibility feature on it so I can use it to show widgets on select pages. It works… read more
Whenever you use the “More Tag” or what some refer to as the “Read More” link, you ultimately split your post into two parts, one being the summary (the part you see in a blog home page) and then the full post (the post single view). You also get the choice with Preferential to choose between an excerpt for your post summaries or content. Excerpts Excerpt is a specific number of words in your summary, but also gives you the ability to use a custom excerpt instead of a snippet of your actual post content. By default, WordPress strips out all HTML formatting from this excerpt summary. This means if you have any links, images, text that is styled to be bold, underlined, etc., this gets stripped out and what gets seen is unformatted text. The excerpt can be used if you insert images directly into your post in the… read more
This plugin is considered optional, but to get the thumbnail layout of recent posts like the live demo website shows, you need a plugin called “Recent Posts Plus”. It offers different layouts based on the settings you choose. In the original download of Preferential, you get a snippet of predefined settings you can use to match that of the demo site. To see this widget in action, you can check out the blog on the demo website: Recent Posts Install the Plugin Go to Plugins >> Add New Search for “Recent Posts Plus” and install it. Setup the Widget Go to Appearance >> Widgets >> and drag a Recent Posts Plus widget into the position you want (re: Blog Right Sidebar) Go to the theme’s download package and open >> recent posts plus >> recent-posts-plus.txt In the Recent Posts Plus widget, start adjusting the settings based on the snippet of… read more
The Preferential theme comes with a preset of font based icons which gives you the flexibility to size and colour them just like you can with any font (text). This theme uses them for the social icons as well some of the HTML Snippets that you can use and change the icon from the large selection that comes with Preferential. You can view the available icons by going into your download package of Preferential and then look for the folder named “icons”. Inside that is a demo.html page you can view in your browser. In this icon folder, there are other items and files, such as a font file that you can install on your “Windows” computer so that if you use a graphics program with font capability, you can create mockups and other artwork using the font “icomoon” which is what the icons are. There is also a file… read more
Preferential is ready for navigation, should you decide to implement it using a plugin called Breadcrumb NavXT. Very easy to setup, and it will give you navigation for your pages or posts. To see this in action, please visit the demo site here: Sample Breadcrumbs Install the Plugin Go to Plugins >> Add New Search for “Breadcrumb NavXT” and then click to install and activate it This gets added to your WordPress Settings menu group which you can customize to your needs Once done, the theme has code already in it that displays your breadcrumb navigation on most pages and posts with exception to the “Front Page”. Screencast – Breadcrumb Navigation
By default, your images inserted into posts and pages have no styling. However, Preferential does include some custom styles you can apply to your images which give you a choice of: Image Bar – The class for this is: class=”pref-img-bar” Image Border – The class for this is: class=”pref-img-border” Rounded Image – The class for this is: class=”pref-img-round” To give you a better idea of what styles you get and how they look, you can check out the live demo site here: Image Styles Adding a Bar Style This style adds a bottom border (bar) to your image: When you insert an image, switch to the “Text” tab of your editor so that you will see the HTML image tag like this example: <img src=”image-path” alt=”short description” width=”300″ height=”200″ /> We need to add a class to our image tag to first apply the custom style: pref-img-bar <img class=”pref-img-bar” src=”image-path” alt=”short description”… read more
There are many ways to create a contact page, but the one thing hey all have in common is that they use a plugin for the actual form that people fill out. Normally I used Contact Form 7 as the plugin, but since I am using Jetpack in the live demo site for Preferential, I decided to give this a try and created this tutorial based on Jetpack. For a basic form, it’s very solid and we know it’s coded well because it’s from the developers over at Automattic (makers of WordPress). Each contact form can easily be customized to fit your needs. When a user submits your contact form, the feedback will be filtered through Akismet (if it is active on your site) to make sure it’s not spam. Any legitimate feedback will then be emailed to you, and added to your feedback management area. NOTE: Even though I am using… read more
This tutorial will help you make a gallery using WordPress. Although this is a common thing with any theme, I will show you how it looks with Preferential as your theme. First thing you want to do is prepare your images ahead of time. I am one who likes to keep things consistent so that I get a nice gallery that is evenly displayed within a page, post, or text widget. This means preparing images by cropping, sizing, and optimizing photos before you upload them. If you were to create a gallery with different sizes of images and some are vertical while others are horizontal, you get a very uneven gallery layout…however, sometimes you may not have the option to make them all the same. Create a page or open a page (or post) where you plan on adding a gallery Click on the Add Media button above the editor… read more
The live demo site for Preferential uses a free plugin called Widgetkit Lite and is available here: Widgetkit Although optional, you can install this and take advantage of a bonus style (mini-template) for the slideshow that is included in your download package of this theme. You can find it in the “widgetkit” folder. Download Widgetkit Go to HERE and download the Lite version of Widgetkit Go to your dashboard >> Plugins >> Add New >> and install Widgetkit, then activate it You will see this get added to the bottom of your admin menu group in the left sidebar column Install the Bonus Style “preferential” Open your FTP program (a program that lets you upload or download files where your website is). If you don’t have one, you should have one if you are running a website. Download a free one called Filezilla…which seems to be popular with many. If… read more
