1. Thank you for your Purchase!
- Created: 16 June 2012
- Authors: Christian Lundgren, Farid Hadi & Shu Miyao
- Theme version: 1.3
- Foundry Panel version: 1.1.5
Thank you for purchasing this theme. If you have any questions that are beyond the scope of this help file, please visit our dedicated forum at support.udfrance.com. To access the forum you will need your Item Purchase Code.
Need help finding your item purchase code?
Click here. Keep in mind that for a quicker response please use the support forum.
2. Theme Installation
2.1 Uploading and Activating
- Make sure to have WordPress v. 3+ installed. If so move on to the next step. If you are new to WordPress and do not have wordpress installed, please click here.
- Unzip the downloaded folder from Themeforest and locate the folder labeled 'Voltage'. This is the folder that you should upload to your server.
- Connect to your web server using an FTP client and upload the 'Voltage' folder to 'wp-content/themes/'. If you do not have an FTP client consider using FileZilla.
- Now log into wordpress and and go to 'Appearance' and click the 'Activate' for 'Voltage'
2.2 Import Demo Data
The demo xml file can be found in your download folder and is labeled: 'demo-content.xml'
- Click 'Tools' > 'Import' in the wordpress menu. ref. figure 1.
- Select Wordpress as your import option, which is last in the list. ref. figure 2.
- Once installed, click 'browse' and select the xml sample data file found in the 'Voltage' folder. ref. figure 3.
- Click 'Upload file and import' ref. figure 3.
- Once imported you will need to set up the menus and widgets.
3. Page Setup
3.1 Adding a Page
- Click the 'Pages' > 'Add New' tab in the wordpress menu. ref. figure 1
- Start by filling in the title, thereafter the content.
- As needed, you can set the 'Page Attributes' such as order, template and whether its main menu item or sub menu item .ref. figure 2
- When you are ready, click Publish .ref. figure 3
3.2 Page Templates
This theme comes with three page templates. These are selected from the 'Page Attributes' section when creating a page. ref. figure 2. above. If you want to use a particular page template follow the steps in 3.1 and simply select the template that you require from the Template combobox.
Use this page template to set up your contact page. Selecting this template will add a contact form automatically.
FULL WIDTH TEMPLATE
Use this template to have no sidebar.
PORTFOLIO INDEX TEMPLATE
This template is used to create a portfolio index with a filter menu.
3.3 Page Options and Uploading images
Please refer to Portfolio setup
3.4 Homepage Slider
First thing to do once you have created your homepage is to go Settings > Reading. Under 'Front page displays' select 'A static page (select below)' and choose your Front-page from the select box. Thereafter click Save Changes.
- Click the 'Upload/Insert' > 'From Computer' > 'Select Files'.
- Select all files you want to appear in the homepage slider and click Ok.
- Once you images have uploaded, go through each image one by one and click the show link in the left hand corner of each upload.
- Add your caption to the Description area.
- Chose the slide media type - image or video. If you select Vimeo or YouTube, simply paste the id. If you select FlowPlayer you need to paste the full url.
- Select caption style if you have entered a caption
- Select caption width. This will set the width of the caption container; Hence, allowing you to style the captions based on the image.
- Set slide background color. This is only necessary if you are using images that are relatively small. Enter background color using hex e.g. #ffffff for white
4. Sidebar & Widgets
Accessing the sidebar widgets is done by clicking Voltage > Sidebar widget. Voltage uses three different right aligned sidebars, namely:
- VOLTAGE Sidebar for Blog pages
- VOLTAGE Sidebar for Contact pages
- VOLTAGE Sidebar for Normal pages
The theme support standard widgets as well as:
To activate the twitter widget simply trage the text widget to your prefered sidebar. Thereafter paste the twitter shortcode in the text area e.g.
Featured Project Slider
To activate the featured project slider simply drag it to your prefered sidebar and set the title.
To activate the Google Map widget simply trage the text widget to your prefered sidebar. Thereafter paste the Google Map shortcode in the text area e.g.
[map id="" lat="" long="" zoom="" width="" height="" info_title="" info_content=""]
5. Posts & Categories
Full details on creating a post/writing can be found here.
5.1 Creating categories
- Click 'Post' > 'Categories' in the wordpress menu.
- Enter the 'Name' of your category.
- If this is a main category leave 'Parent' set to 'None'. If this is a sub category, then select the parent category from the combobox.
- Click 'Add New Category' and your category will appear on the right.
5.2 Creating a post
- Log in to your WordPress Administration Panel (Dashboard).
- Click the 'Posts' in the wordpress menu.
- Click the 'Add New' sub tab.
- Start by filling in the title, thereafter the post.
- As needed, select a category, add tags, and make other selections from the right hand menu.
- When you are ready, click Publish.
6. Folio Setup
6.1 Adding a portfolio item
- Log in to your WordPress Administration Panel (Dashboard).
- Click the 'Voltage' in the wordpress menu. ref. figure 1
- Click the 'Portfolio' sub tab .ref. figure 1
- Click the 'Add new' button next to the Portfolio title ref. figure 2
6.2 Portfolio, Page and Post Options
- Display Title - we set our project title here if we want to use font variation in the title e.g.
If you do not want to use font variation you can simply enter the title in the normal title field.
- Teaser or Tagline - Use this space to introduce the project. Either use a simple tagline or teaser for a more comprehensive layout. You can use shortcodes to styles this area.
- Gallery Title(only portfolio) - If you want to show addtional images or videos in the form of a gallery then set the title here.
- Portfolio layout (or post/page layout) - Default or Video. The former allows you to display either one featured image with custom caption or a slider. The latter allows you to display a video in this area.
- Featured Project (only portfolio) - Whether project will be featured in the sidebar featured slider or not.
6.3 Uploading & Managing Photos
- Description - Add slide or featured image caption here
- Display In (only portfolio) - Select whether image should be displayed in slider or in gallery or in neither
- Media Type - Choose your media type Image, FlowPlayer, YouTube, or Vimeo
- Video URL - Fill this in only if the Media type has been set to anything but Image. For YouTube and Vimeo simply enter the video ID, for FlowPlayer add the full url to the video.
- Caption Style - If you have entered a caption then select the way this caption should be displayed
- Caption Width - Set the width of the caption to style it differently.
- Slider Background Color - Set a slide background color using hex value
Once you have set all options for all uploaded image selection which image should be the featured image, this is the image that will appear as a thumbnail in the portfolio index. ref. fig.1
6.4 Project Order
You can select whether projects should be ordered by date or simply by menu order. For the former the latest project will by default appear first.
Projects are organized by date of creation. You can, however, change the project order by simply modifying the project date. To do this, click Portfolios, thereafter click "Quick edit" and change the date of creation of the portflio item you want to reorganize
By Menu Order
If you have selected menu order you set order by change menu order number.
7. Foundry Panel Setup
Foundry Panel Settings
- General Settings
- Header Info e.g. tel/e-mail
- Scroll to top speed
- Contact Form - Title and contact form messages
- Social Networks - Social network icons and links
- Footer Content - Copyright statement
- SEO - Google analytics tracking code
- Theme skin
- Blog layout
- Recent Posts on front-page
- Recent Post title
- Number of posts to display
- Post Category Id - which category to pull posts from
- Logos - Upload theme logos
- Fonts - Theme fonts
- Title & Link Colors
- Slider - All slider options
- Custom CSS - Css editor for custom styles
- Shortcode Settings
- Google Map - Controls and Custom Marker
Voltage contains a range of different shortcodes for quick and easy layout creation. All shortcodes used in Voltage can be found in the 'Shortcode' section of the demo.
Layout and Style Shortcodes
Attributes Possible values n/a n/aNote: This shortcode is used to specify which sides of an element where other floating elements are not allowed.
H Tag VariationConstructed: Your [span]Title[/span] Here
Attributes Possible values n/a n/aNote:: This shortcode is usable for all content, widgets, and slide-in footer.
Column shortcodesConstructed: [column_one_half] ...your content... [/column_one_half] [column_one_half_last] ...your content... [/column_one_half_last]
Attributes Possible values none column_one_half, column_one_third, column_one_fourth, column_one_fifth, column_two_thirdsNote: we add the suffix '_last' to the last column to remove its right margin, ensuring that the columns align nicely.
Drop cap shortcodesConstructed: [drop_cap style="color:#ff6a28;"]...letter...[/drop cap]
Attributes Possible values style custom style information (overrides default values)
Blockquote shortcodesConstructed: [blockquote align="" text_align="" cite="" style=""]...quote...[/blockquote]
Attributes Possible values align left or right text_align leave blank for default, or center cite text i.e. John Doe style custom style information (overrides default values)
Button shortcodesConstructed: [button size="" url="" color="" style=""]Button Title[/button]
Attributes Possible values url target url i.e. http://www.google.com size small, medium, large color gray, white, turquoise, yellow, orange or blank for default style custom style information (overrides default values)
Highlight shortcodesConstructed: [highlight color="" highlight_type="" style=""]...your content...[/highlight]
Attributes Possible values color gray, white, turquoise, yellow, orange or blank for default highlight_type bold or italic style custom style information (overrides default values)
[list list_style='' style='']
<span>...list content... </span>
Attributes Possible values color darkGray, white, turquoise, yellow, orange or blank for default type Dot, Arrow1, Arrow2, Tick, Plus, Dash style custom style information (overrides default values)Note: List types are created as follows: type + color > darkGrayDot, turquoiseArrow1 etc. See demo for all examples
Image + LightboxConstructed: [lightbox id="" width="" height="" thumbnail_url="" url="path" style=""]
Attributes Possible values id thumb id width numeric value e.g. 200px height numeric value e.g. 200px thumbnail_url path to thumbnail url path to target image style custom style information (overrides default values)
Video + LightboxConstructed: [lightbox id=" width="" height="" thumbnail_url="" url="" media_type="video"]
Attributes Possible values id thumb id width numeric value e.g. 200px height numeric value e.g. 200px thumbnail_url path to thumbnail url path to target video - youtube, vimeo or selfhosted style custom style information (overrides default values)
Image + CaptionsConstructed: [image width="" height="" caption_width="" url="path" caption_style=""]caption content[/image]
Attributes Possible values width numeric value e.g. 200px height numeric value e.g. 200px caption_width numeric value e.g. 200px url path to image caption_style impact, box, black_box, top_box, black_top_box, descrete style custom style information (overrides default values)
Embed VideoConstructed: [video type="" url=""]
Attributes Possible values type vimeo, youtube, or flowplayer url id or path(only for flowplayer)
SliderConstructed: [slider id=""]
Attributes Possible values id slider post idNote:A slider id is found in the url of a slider post e.g. http://udfrance.com/dev/t5/wp-admin/post.php?post= 335&action=edit
Google MapConstructed: [map id="" lat="" long="" zoom="" width="" height="" info_title="" info_content=""]
Attributes Possible values id map id, necessary if two or more maps are displayed on one page lat map latitude value long map longitude value width numeric value e.g. 200px, leave blank for default of 100% height numeric value e.g. 200px, leave blank for default of 210px info_title tooltip title info_content tooltip text contentNote: For lat/long of a location please visit: http://www.gorissen.info/Pierre/maps/googleMapLocationv3.php
9. Sources & Credits
A special thanks to photographer/s Ethan Yang(http://www.ethanyangphotography.com/blog/ and art director H1 (http://h1.io/) for granting us permission to use their photos! Please note these photos are copyrighted by the respective photographers and can therefore NOT be included in the download file. And to their team:
A thanks to H1 for granting us permission to use the following vimeo videos:
- NEGARIN LONDON A /W 12-13,
- Chris Styles @ IBIZA ,
- Busta Rhymes “Why Stop Now ft. Chris Brown” Music Video
- Amanda, by H1
- Rick Genest aka Rico the Zombie - Embrace Everything That Is Different - by The Avant/Garde Diaries
Third Party Scripts
- Todd Matthews & Steve Purcell - Twitter Plugin Script - Visit Website
- Samn Dunn - Supersized Background Script - Visit Website
- Jacek Galanciak (razorjack) - Quicksand Script - Visit Website
- Social Networking icons by Fresh Ideas:Visit Website.
- Coding Jack - Swipe Script http://www.codingjack.com/playground/swipe/
Icons and other sources
Social Networking icons by Fresh Ideas -Visit Website
Once again, thank you so much for purchasing this theme. As stated in the beginning, we'd be glad to help you if you have any questions relating to this theme. No guarantees, but our support staff will do the best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.
The UnlimitDesign Team
Help us improve this & future themes!
We would like to hear what you think about our product, both the positive and negative! Use the form below to share your thoughts. By sending us a review you agree that your response can be used for marketing purposes i.e. testimonials. Thank you!