Trusted

Created on : April 20, 2017
Latest Update : May 15, 2017
Buy Now

Install

I assume you already have a fresh copy of WordPress installed on your server.

You can install the Trusted WP Theme in three different ways:

1. Using Envato Market plugin – preferred method
You can install any theme you purchased on ThemeForest by installing the Envato Market plugin. Download the plugin here, by clicking on the Download .zip button. Install the plugin like you would any other plugin in a zip file and activate it. Follow the instructions in the Envato Market menu item. This is the preferred method, because you will be able to update the theme to a newer version (we are continually improving our products) from within the WordPress dashboard, like you would update a plugin or an official theme.

2. Upload a zip file
When you are logged in your WordPress dashboard go to Appearance » Themes » Add New » Upload Theme and select the zip file Trusted.zip you downloaded from the ThemeForest (installable WordPress files only) and click Install Now button.

3. FTP upload
Unzip the contents of the Trusted.zip file and upload the folder named Trusted to your server to wp-uploads/themes/ folder using a FTP client.
Once your theme is on the server, activate it by clicking the Activate button below the preview image in Appearance » Themes

Don’t forget to activate Trusted WP

Congratulations! Now the Trusted WP Theme is installed.

Customize Appearance

You can fully customize the appearance of the Trusted WP Theme. Go to the Appearance » Themes and click on the Customize button:

The new window appears and you can now customize the appearance of your theme – upload your custom logo, change the base colors, enable/disable theme features, add Custom CSS etc

Demo Content

You can easily duplicate our demo using One Click Demo button. This feature helps to prepare your site without hassle.

One Click Install Demo

You can import demo content from our demo site with a single click of a button. Go to Appearance » Import Demo Data and click on the import button.

 

This process may takes a minute or more. Please wait and don’t close your browser while importing the data

Header

Top Left & Top Right Widget

On the very top of site you can add widgets to display your tag line or slogan or everything you want on both side Top Left & Top Right. Go to Appearance » Widgets . Put your desired widget on Top Left or Top Right section. For example to show site slogan you can add/drag TEXT widget on left side to Top Left section. Write your slogan and click save.

Header Widget

On the right side from site title you can add widgets to display some information about your business. Go to Appearance » Widgets. For example you can add / drag [Codemagna Icon Text Big] & [Codemagna Button] widget to this section, don’t forget to click save.

Favicon

Since WordPress version 4.3, the favicon setting can be found in Appearance » Customize » Site Identity, where you have to set the Site Icon option.

Navigation Menu

Main Menu can be set in WP-Admin » Appearance » Menus. Theme locations for Main Menu is called Primary.

Pages

WP-Admin » Pages is the area where you building a site mostly using page builder.

Page Templates

You can choose between 4 different Templates – Default Template, Front Page with Slider , Fullwidth and Left sidebar.

Default Template: Just a default template for simple layouts and Page Builder. First you must choose the Page Builder option under the title and you are ready to go. You can add our widgets here, choose different visual styles and much more. More about that in the next chapter.

Front Page with Slider: This is a unique template which adds an option for a slider in the page options. It can be used with Page Builder. More about that in the Slider chapter.

Fullwidth: When you need a page without a sidebar, this is the right template to choose.

Left Sidebar: A page template with sidebar position on the left.

Page Builder

Our page builder using Page Builder by SiteOrigin, it’s very popular (downloaded more than 1 Million) on WordPress yet very powerful tool for create pages. Here is an example of how it looks:

You can make any kind of grid with adding new rows and inside them you put widgets. When you are finished with adding widgets you can also move whole rows up and down.

For more information on how to use Page Builder please visit Page Builder by SiteOrigin documentation page.

PAGE BUILDER ROW STYLE & ATTRIBUTE

Let’s take a look at how we can style Page Builder rows.

To start off we have to click on “Edit Row” for the row that we want to style as shown on the image above. An “Edit Row” window will open, and on the right, there are three setting tabs: Attributes, Layout and Design. Here you can customize different things for this particular row.

In the Layout tab you can set the Bottom Margin, Padding and change the Row Layout to Full Width. In the Design tab you can set the Background Color, Background Image and other things.

We have some helpful classes to help you style the elements. One of our class for row is “ section-content “ if you give this class to your row. It will gives the row 60px padding top and bottom. About our helpful classes we will explain it on Helpful Class chapter.

Page Builder Widgets

We use two widget bundles SiteOrigin Widget Bundles and Codemagna Widgets. You can see more information about SiteOrigin Widget Bundles on their plugin site. Don’t forget to activate widgets.

CODEMAGNA WIDGETS
We made 11 (we add more in next updates) widgets for website builder. Here is the list of codemagna widgets:

  1. Codemagna Button
  2. Codemagna Icon Text Big
  3. Codemagna Icon Text Inline
  4. Codemagna Latest News Grid
  5. Codemagna Latest News List
  6. Codemagna News Grid
  7. Codemagna Recent Project Slider
  8. Codemagna Section Title
  9. Codemagna Service Grid
  10. Codemagna Service List
  11. Codemagna Testimonial

CODEMAGNA BUTTON
You can create button using this widget, also you can use button shortcode either.

CODEMAGNA ICON TEXT BIG
Icon text big used for display Icon besides the text. It has same function with Icon Text Inline. You can use it to display short information.

CODEMAGNA ICON TEXT INLINE
Has same function with Icon Text Big. But text displayed inline with icon.

CODEMAGNA LATEST NEWS GRID
Displays latest news / post using grid style. Only display one news. This Widget is limited to 100 latest posts, so the highest number that you can input is 100.

Info: Offset means the news from latest news. If you want to display the latest news it means offset = 0.

CODEMAGNA LATEST NEWS LIST
Displays latest news / post using List style. It can displays more than one news. This Widget is limited to 100 latest posts, so the highest number that you can input is 100.

CODEMAGNA NEWS GRID
Display news / post using grid style. All you need is put the desired Post ID.

Info: How to get the post ID: WP Admin > posts > all post > select post you want > click EDIT. Then copy the number from browser URL. After “…/post.php?post=[the-post-ID]” example: yoursite.com/wp-admin/post.php?post=12&action=edit. It means the post ID is “12”.

CODEMAGNA RECENT PROJECTS SLIDER
To display projects using slider you’ve been created on WP Admin » Projects. This widget only can contains 8 latest projects.

CODEMAGNA SECTION TITLE
When you need title for desired section. You can use this widget.

CODEMAGNA SERVICE GRID
To display service using grid style you’ve been created on WP Admin » Service. It only displays one service.

CODEMAGNA SERVICE LIST
To display service using list style you’ve been created on WP Admin » Service. It can displays more than 1 service.

CODEMAGNA TESTIMONIAL
Every business needs testimonials to prove that their products are best and recommended by customers. You can use this widget to displays your customers testimonial.

Slider

Building a Theme slider has never been easier. First you have to create Slide from WP Admin » Slides » Add New Slide.

Then go to WP Admin » Page create new page don’t forget to choose the page template Front Page With Slider. This is an example from one of our themes:

You also can using page builder to create a slide.

Youtube.
We have sample video how to setup slider

 

Theme Options

You can find all Theme Options in two ways, first the Customizer: Appearance » Customize.This is a live preview editor for your page. The second one WP Admin » Theme Options.

Here you can change:
General
– Logo
– Page Title Pattern
– Site Footer Background
– Copyright Text
– Footer Text
Colors
– Primary Color
– Secondary Color
– Site Header Background Color
– Site Title Color
– Site Description Color
– Site Footer Background Color
Slider
– Disabled / Enabled Autoplay
– Autoplay Interval Timer
Typography
– Header Font
– Body Font

Shortcodes

We use Bootstrap 3 Shortcodes for WordPress. The documentation on how to use this shortcode is already explained inside the shortcodes. So when you click the Bootstrap shortcode button, they will show you the explanation about how to use.

Plugins

We also use and support some of the best plugins for WordPress.

Required And Recommended Plugins

You can install and activate these plugins by going to WP Admin » Appearance » Install Plugins.
The list of required and recommended plugins used in this theme:

– Redux Framework
– Page Builder by SiteOrigin
– SiteOrigin Widgets Bundle
– LESS PHP Compiler
– SiteOrigin Builder Animate
– Breadcrumb NavXT
– Tiny MCE Advanced
– Bootstrap 3 Shortcodes
– Contact Form 7
– Custom Sidebar
– Codemagna Widgets

Bootstrap 3 Shortcodes

We use Bootstrap 3 Shortcodes to display Boostrap’s elements. Some functional example we used to use :

– Button
To display button shortcode.

[button type=”success” size=”lg” link=”#”] Your Text Here [/button]
– Icon
To display icon with font-awesome. Example
[icon xclass=”fa fa-globe”]
– Button with icon
To display Button with icon. Example

 [button type=”success” size=”lg” link=”#”][icon xclass=”fa fa-arrow-right”] Your Text Here [/button]
.upil{
width:90px;
}

Contact Form 7

We use Contact Form 7 for our Contact Us page. This is the code from our demo:

<div class="contact-form__wrapper">
<form class="form-horizontal">
<div class="form-group row">
<div class="col-md-6">
<label> Your Name (required)
[text* your-name class class:form-control]
</label>
</div>

<div class="col-md-6">
<label> Your Email (required)
[email* your-email class:form-control]
</label>
</div>
</div>

<div class="form-group row">
<div class="col-md-12">
<label> Subject
[text your-subject class:form-control]
</label>
</div>
</div>

<div class="form-group row">
<div class="col-xs-12">
<label> Your Message
[textarea your-message class:form-control]
</label>
</div>
</div>

<div class="form-group row">
<div class="col-xs-12">
[submit class:btn class:btn-primary "Send"]
</div>
</div>
</form>
</div>

Custom Sidebar

Footer

Footer Widgets

Footer Widgets is the place where you can add the last things to your page. You can add widgets in the Apperance » Widgets » Footer. There are also few options for that area in WP Admin » Theme Options » General. You can changes copyright text & footer background there. We have two locations for footer widget. Bottom Left & Bottom Right.