Pinpoint Docs - Installation & Setup Guide

Pinpoint Documentation by Swift Ideas v1.
0
Pinpoint - Responsive Multi-purpose WordPress Theme
Created: January 2013
By: Swift Ideas
Support: http://support.swiftpsd.com (http://support.swiftpsd.com)
Thank you for purchasing Pinpoint. If you have any questions that aren't covered in the documentation, then please feel free to
email via our user page contact form here (http://themeforest.net/user/swiftideas). Thanks again!
Table of Contents
Installation (#installation) 1.
WordPress Installation (#wordpress-installation)
Theme Installation (#theme-installation)
Activating Pinpoint (#activating-theme)
Setting up (#setting-up) 2.
Demo Content (#demo-content)
Logo (#logo)
Pages (#pages)
Menus (#menus)
Posts (#posts)
Portfolio (#portfolio)
Showcase (#showcase)
Sliders (#sliders)
Team (#team)
Clients (#clients)
Testimonials (#testimonials)
Jobs (#jobs)
FAQs (#faqs)
Widget Areas (#widget-areas)
Theme Features (#theme-features) 3.
Swift Page Builder (#swift-page-builder)
Color Customizer (#color-customizer)
Pinpoint Options (#theme-options)
Custom Page Templates (#custom-page-templates)
Included Plugins (#revolution-slider)
Custom Widgets (#custom-widgets)
Shortcode Generator (#shortcode-generator)
Translation (#translation)
WooCommerce (#woocommerce)
Custom Login Logo (#custom-login-logo)
Included Files (#included-les) 4.
CSS Files (#css-les)
JavaScript Files (#javascript-les)
Pinpoint - Responsive Multi-purpose WordPress Theme ... file:///Users/cr4ckt0rx/Desktop/50 Themeforest Wordpres...
1 sur 14 2014-08-17 06:56
A) Installation - top (#toc)
WordPress Installation
This theme requires a working version of WordPress to already be installed on your server. If you need to install WordPress then
please visit: http://wordpress.org/download/ (http://wordpress.org/download/). If you need any help with the installation, please
refer to this guide: http://codex.wordpress.org/Installing_WordPress (http://codex.wordpress.org/Installing_WordPress).
Theme Installation
The theme les need to be uploaded before you can activate the theme for use. There are two ways you can do this, FTP upload
or WordPress upload.
If you are uploading via FTP upload, then you need to upload the unzipped folder pinpoint to the /wp-content/themes folder of
your WordPress installation.
If you are uploading via WordPress upload, then navigate within the WordPress admin area to Appearance > Add New Themes
> Upload. Select the zipped le pinpoint.zip and then hit Install Now.
Activating Pinpoint
Once you have uploaded the theme, you need to activate it by going to Appearance > Themes, and activate Pinpoint.
B) Setting up - top (#toc)
Demo Content
Both the theme content and theme options have been provided so that you can set up the theme to look exactly like the demo in
a few minutes. You can nd the main demo XML le, along with the revolution slider import. This XML le is to use through the
WordPress import tool, which can be found in Tools > Import > WordPress. Follow the steps to import the demo content and
leave the nal page to load with a conrmation that the content has been imported successfully (this may take some time).
Once you have imported the demo content XML, you will still need to set the home page by going to Settings > Reading, and
also select the menu in Appearance > Menus.
The theme options text le is to copy and paste the contents into the box provided within Pinpoint Options, under the
Import/Export sub-menu.
If you have any issues with the import, i.e. any errors, then please contact your hosting to increase your php memory upload limit
before contacting our support for help.
2 sur 14 2014-08-17 06:56
Logo
You can change the themes logo by accessing the Pinpoint Options and uploading your logo with the uploader under the
Header Options section.
There are also logo spacing controls if you would like to manually add padding the logo area.
Menus
By selecting the Appearance > Menus option from the WordPress admin sidebar, you can set the top navigation by creating a
menu, and on the left under Theme Locations set the Main Menu dropdown to be your newly created menu and then click save.
This will allocate your created menu to the header navigation of the theme.
3 sur 14 2014-08-17 06:56
The theme supports two levels of drop-down, so you can manage your menu items and allow for deeper navigation.
Posts
The Posts menu option on the left is where you add blog posts. To add a new blog post, select the Posts > Add New option from
the left hand WordPress menu.
You will then be able to set a title for the blog post, add the body content, and also provide all the meta information such as extra
details and media. In the blog meta you can set the image for the thumbnail, and also the media type for the detail page.
You can use the Swift Page Builder to create the content of the item, which e!ectively allows you to have limitless possibilities
for what you can display, and also how you can display it. If you do use the Page Builder to create the content, you will want to
provide a custom excerpt (can be found in the item meta).
To display your blog posts, you will then need to create a page that includes the "Blog" or "Recent Posts" page builder asset.
The blog asset has the following options included, allowing you to customise the output to your liking:
NOTE: DO NOT set the posts page in Settings > Reading, as this will force your page to show the standard layout, and not
follow your created page.
4 sur 14 2014-08-17 06:56
Portfolio
The Portfolio menu option on the left is where you add Portfolio items. To add a new portfolio item, select the Portfolio > Add
New option from the left hand WordPress menu.
You will then be able to set a title for the portfolio item, add the body content, and also provide all the meta information such as
extra details and media. In the portfolio meta you can set the image for the thumbnail, and also the media type for the detail
page.
You can add categories for each portfolio item's which act as the lters in the ltering system, and also a way to create multiple
portfolio pages. You can have subcategories for ltering on a category Portfolio page, so none of the functionality is lost. When
setting up categories, it is important that you name the slugs correctly. The slug of each category should be the same as the
name, but all lowercase. If the category name contains spaces, then these should be represented in the slug with a '-'.
You can use the Swift Page Builder to create the content of the item, which e!ectively allows you to have limitless possibilities
for what you can display, and also how you can display it. If you do use the Page Builder to create the content, you will want to
provide a custom excerpt (can be found in the item meta).
To display your portfolio items, you will then need to create a page that includes the "Portfolio" page builder asset. The portfolio
asset has the following options included, allowing you to customise the output to your liking:
Showcase
5 sur 14 2014-08-17 06:56
The Showcase menu option on the left is where you add Showcase Slides. To add a new slide, select the Showcase > Add New
option from the left hand WordPress menu.
The slide image is taken from the Featured Image for the slide, so make sure you attach a featured image.
If you would like to add a link to the slide, then enter a link into the "Slide Link" eld.
Sliders
The Sliders menu option on the left is where you add slides to create groups of sliders which you can then use wherever you like
within your content. To add a new slider, select the Sliders > Slide Groups option from the left hand WordPress menu. Here you
can add a new group, where each group is taken as an individual slider.
You can then go to Sliders > Add New Slide. To create a slide you will want to follow the following steps:
Give the slide a title. 1.
Select a group for the slide in the right column (Slide Groups). This will add it to that slider group. 2.
You'll then want to add your media, so click the Add Media button. You can then choose to either upload an image,
provide a URL, or select an existing image.
3.
Once you have the image you want to use, click "Insert to post". 4.
If you'd like to instead use a Vimeo/YouTube video embed for the slide, simply post the iframe embed code into the "Text"
tab of the editor.
5.
Enter an excerpt in the box below for if you choose to display an excerpt over the top of the slide. 6.
Publish your slide. 7.
To display a slider in the content of posts or pages, you will nd that we have conveniently added a new tab in the "Add Media"
popup window tited "Sliders". Inside this tab, you can setup your slider with settings specic to the type of slider selected, as
well as override any of the "Advanced Settings" specied on the main "Settings" screen. To add a slider, please use the following
steps:
Click the "Add Media" button above the WYSIWYG editor when editing your page/post/post type. 1.
Select the "Sliders" tab. 2.
Choose your desired slideshow type and setup the options pertaining to the selected type (all elds are optional). 3.
If you'd like to override any of the global slideshow settings, click the "Advanced Settings" button and make any
adjustments you'd like (only the modied items will be added to the shortcode).
4.
Click the "Insert Slider" button. 5.
NOTE: To add a slider in a Page Builder page, just insert a text block to the size you want it to be on the page, then add the
slider to the content of that text block.
Team
The Team menu option on the left is where you add team members. To add a new team member, select the Team > Add New
option from the left hand WordPress menu.
You will then be able to provide all the details for the team member through the team member meta box.
To show your team members, you will need to create a page that includes either the "Team" or "Team Carousel" page builder
assets.
Clients
The Clients menu option on the left is where you add clients. To add a new client, select the Clients > Add New option from the
left hand WordPress menu.
6 sur 14 2014-08-17 06:56
You will then be able to provide an image for the client, and a link if you'd like through the client meta box.
To display your clients, you will then need to create a page that includes the "Clients" page builder asset.
Testimonials
The Testimonials menu option on the left is where you add testimonials. To add a new testimonial, select the Testimonials > Add
New option from the left hand WordPress menu.
You will then be able to provide the testimonial in the post content, and then the testimonial cite in the testimonial meta box.
To display your testimonials, you will then need to create a page that includes the "Testimonails" page builder asset.
Jobs
The Jobs menu option on the left is where you add job listings. To add a new job listing, select the Jobs > Add New option from
the left hand WordPress menu.
You will then be able to enter the content for the job in the post content editor.
To display your job listings, you will then need to create a page that includes either the "Jobs" or "Jobs Overview" page builder
asset.
FAQs
The FAQS menu option on the left is where you add faqs. To add a new faq, select the FAQs > Add New option from the left
hand WordPress menu.
You will then be able to enter the question (the title of the faq), and the answer in the the post content editor. You will also need
to add a topic for each faq.
To display your faqs, you will then need to create a page that includes the "FAQs" page builder asset.
Widget Areas
There are up to 12 widget areas that can be viewed under the Appearance > Widgets menu, eight sidebar areas, and four footer
column widget areas. You can select which sidebars appear on the page through the page/post editor. The number of footer
sidebars depends on the footer setup that you choose within Pinpoint Options.
C) Theme Features - top (#toc)
Swift Page Builder
7 sur 14 2014-08-17 06:56
The Swift Page Builder (SPB) allows you to create unique and amazing pages, exactly the way you want them! The SPB is
powered by shortcodes, which are embedded when you select the content elements you want, and edit them. You can see the
source by going back to the classic editor, although you shouldn't ever need to do this and you should only make changes to
this if you know what you're doing.
To add a content element to the page, all you need to do is drag the element from the dropdown into the content area, or simply
click on it to have it added automatically. You can then edit the column width (on applicable elements) by pressing the left/right
arrows in the top left of the content element, and also edit the asset (the pencil), duplicate the element, or delete the element.
8 sur 14 2014-08-17 06:56
When you click on the edit button, you will be given the option of specifying a number of parameters based on the content
element. Below is a screenshot from the edit screen of the Portfolio content element. As you can see there are a wide number of
options for you to choose from.
The SPB includes a Blank Spacer element, which allows you to add spacing in between your content elements, to suit your
needs. We decided on making this user controlled, so that there is never a case where you don't have the spacing you need.
Please watch the video below to get an idea of how to use the Page Builder:
9 sur 14 2014-08-17 06:56
Pinpoint Page Builder Demo
from Swift Ideas PRO
04:22
Color Customizer
The color customizer can be accessed by pressing the "Color Customizer" button within the WordPress admin bar, or through
the Appearance > Themes menu. From the color customizer you can preview the themes color/skin changes as you make them.
10 sur 14 2014-08-17 06:56
Pinpoint Options
The theme options can be used to customise the theme to suit your needs, including backgrounds, layouts and much more. You
should take the time to go through all of these options to ensure that you are getting the most out of the theme.
Custom Page Templates
Default - This page template is the default page template, which can be set up to display in various congurations through the
page meta options, and you can either add content via the standard WordPress editor, or through the Swift Page Builder.
Full Width Showcase (Rev Slider) - This page template is exactly the same as the default page template, except it has a xed full
width slider at the top of the page. This template is ideal for use with the full width layout. You will need to enter the alias for the
Revolution Slider that you'd like to use in the meta below the content editor.
Revolution Slider
The theme includes the premium plugin - Revolution Slider. You can nd documentation for this included within the
Documentation > Revolution Slider Documentation folder.
Custom Widgets
Flickr - This ickr widget shows o! your ickr photos. You can get the required API Key from this link: http://www.ickr.com
/services/api/misc.api_keys.html.
Twitter - The Twitter widget displays a number of your latest tweets. You can specify parameters such as username, number of
tweets to display, refresh time, and date display.
Video - The Video widget embeds a video from a url that you enter into the input eld within the widget options. You can nd out
what type of video you can embed here (http://codex.wordpress.org/Embeds).
11 sur 14 2014-08-17 06:56
Shortcode Generator
Pinpoint includes the Swift Framework Shortcode Generator, which is a custom built feature for our themes. The generator
allows you to embed shortcodes within your content quickly without having to remember the syntax. The generator allows you to
select the type from the list, and provide parameters (if needed).
You can nd the shortcode generator within the WordPress WYSIWYG editor. The button looks like this:
Translation
Pinpoint is 100% translation and multi-lingual ready, and we recommend that you use the very popular WPML plugin.
(http://wpml.org/?aid=27185&
a!liate_key=PbyGf1bMfZHc)
To translate the static strings, if you aren't
using WPML then I recommend downloading
PO Edit, from http://www.poedit.net/
(http://www.poedit.net/). Once you have installed please follow the steps below:
Open the /pinpoint/languages/ folder and duplicate the en_US.po le, then rename it to your desired language code. For
example; for German you need to re-name it as de_DE.po for Spanish es_ES.po for Turkish tr_TR.po etc. You can nd all
the codes from this link http://codex.wordpress.org/WordPress_in_Your_Language (http://codex.wordpress.org
/WordPress_in_Your_Language)
1.
Then you will need to open the .po le in PO Edit. Once opened, you will see all strings that needs to be translated. Type
the translation of a string into the "Translation" column. Do not delete or edit "Original string" part.
2.
When you nish translating, save the le. This will create an .mo le in the same directory. 3.
Upload the new les into the languages folder of the theme /wp-content/themes/pinpoint/languages/ and then follow this
guide: http://codex.wordpress.org/Installing_WordPress_in_Your_Language#Single-Site_Installations
(http://codex.wordpress.org/Installing_WordPress_in_Your_Language#Single-Site_Installations)
4.
WooCommerce
We have provided compatibility pre-built into Pinpoint for WooCommerce. There is a special sidebar for the WooCommerce
pages in Appearance > Widgets, that appears only on WooCommerce pages.
You will need to edit and save each of the individual WooCommerce pages to get the page headings to work.
Custom Login Logo
You can change the login logo by replacing the image in the themes /images/ folder. The image is named custom-login-
logo.png. You can replace it by uploading the image via your chosen method (e.g. FTP). You can also replace this image
through the Pinpoint Options menu under General Options.
D) Included Files - top (#toc)
CSS Files
12 sur 14 2014-08-17 06:56
base.css - part of the Skeleton boilerplate. More info: Skeleton (http://www.getskeleton.com).
layout.css - part of the Skeleton boilerplate. Contains all of the repsonsive media queries for the theme. More info: Skeleton
(http://www.getskeleton.com).
skeleton.css - part of the Skeleton boilerplate. More info: Skeleton (http://www.getskeleton.com).
custom-styles.css.php - The custom styling, including colours and selected theme option styling. Also includes the custom css
from the theme options, and the css for the font options.
styles.css - The main css for the theme, which includes the layout and styling for all aspects of the theme.
font-awesome.css - Font Awesome icon font. More info: Font Awesome (http://fortawesome.github.com/Font-Awesome/).
JavaScript Files
functions.js.php - This is where all the custom magic happens. Feel free to edit any of this code, but make sure to keep a backup
in case anything goes wrong!
jquery-ui-1.8.17.custom.min.js - A custom version of jQuery UI for the tabs & accordion shortcodes.
jquery.fancybox.pack.js - PREMIUM PLUGIN. fancyBox is a tool that o!ers a nice and elegant way to add zooming functionality
for images, html content and multi-media on your webpages. You can nd out more here: http://fancyapps.com/fancybox/
(http://fancyapps.com/fancybox/).
jquery.tvids.js - A lightweight, easy-to-use jQuery plugin for uid width video embeds.. You can nd out more here:
http://tvidsjs.com/ (http://tvidsjs.com).
jquery.exslider.min.js - an awesome, fully responsive jQuery slider plugin.. You can nd out more here:
http://www.woothemes.com/exslider/ (http://www.woothemes.com/exslider/).
jquery.hoverIntent.min.js - hoverIntent is a plug-in that attempts to determine the user's intent. You can nd out more here:
http://cherne.net/brian/resources/jquery.hoverIntent.html (http://cherne.net/brian/resources/jquery.hoverIntent.html).
jquery.isotope.js - Isotope: An exquisite jQuery plugin for magical layouts. You can nd out more here:
http://isotope.metazzy.co/index.html (http://isotope.metazzy.co/index.html).
jquery.jcarousel.min.js - jCarousel is a jQuery plugin for controlling a list of items in horizontal or vertical order. You can nd out
more here: http://sorgalla.com/projects/jcarousel/ (http://sorgalla.com/projects/jcarousel/).
jquery.supersh.js - Supersh is an enhanced Suckersh-style menu jQuery plugin that takes an existing pure CSS drop-down
menu and enhances it. You can nd out more here: http://users.tpg.com.au/j_birch/plugins/supersh/ (http://users.tpg.com.au
/j_birch/plugins/supersh/).
respond.min.js - A fast & lightweight polyll for min/max-width CSS3 Media Queries (for IE 6-8, and more). You can nd out more
here: https://github.com/scottjehl/Respond (https://github.com/scottjehl/Respond).
view.min.js - PREMIUM PLUGIN. A simple, lightweight, jQuery photo viewer for the web. You can nd out more here:
http://negoodsmarket.com/view/ (http://negoodsmarket.com/view/).
Once again, thank you so much for purchasing this theme. Customer satisfaction is our #1 priority, which is why we always
endeavour to provide the best service we can. Were only an email away if you ever need us!
Swift Ideas
13 sur 14 2014-08-17 06:56
Go To Table of Contents (#toc)
14 sur 14 2014-08-17 06:56

Pinpoint Docs - Installation & Setup Guide

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Pinpoint Docs - Installation & Setup Guide

Uploaded by

Copyright:

Available Formats

Pinpoint Documentation by Swift Ideas v1.

You might also like