Getting Started

Thank you for choosing Pantograph! Lets begin starting your project with Pantograph.

Save the downloaded theme’s files on your pc first. Navigate to the Downloads section in your Envato / ThemeForest account, your purchases are kept there. Click the Download button to get the theme, make sure you’re clicking the “Installable WordPress file only”.

After that please follow the following 3 steps.

Step 1: Theme Installation →

Theme Installation

Now that the theme’s files are saved on your pc, you can log into WordPress administration dashboard to upload and install it.

  1. Navigate to Appearance > Themes and click the “Add New” / “Upload Theme
  2. Upload the file you’ve downloaded from ThemeForest in the previous step and click Install Now.
  3. Once the file has been uploaded click the Activate link.


Step 2: Plugin Installation →

Plugin Installation

After choosing design from your design settings page, you should visit your plugins page (Settings > Plugins Page). You need to download the 3 required plugins and then upload those plugins in your wordpress by visiting ‘Plugins > Add New‘ page. Install the 3 plugins and activate them.

Step 3: Demo Content Import →

Demo Content Import

Importing demo data (post, pages, images, theme settings, widgets …) is the easiest way to setup your theme. It will allow you to quickly edit everything instead of creating content from scratch.

When you import the data, the following things might happen:

  • No existing posts, pages, categories, images, custom post types or any other data will be deleted or modified.
  • Posts, pages, images, widgets, menus and other theme settings will get imported.
  • Please click on the Import button only once and wait, it can take a couple of minutes.

Step 1 : Before install the demo content you can check the full preview of demo site. After checking the preview, Just click on import button. A pop up form will appear where you will see a link given to open the Theme-Options import codes. Click on that link and then click on the ‘Import’ button. It can take around 5 minutes to complete the importing.

Step 2 : Need to import theme options for your current demo. Go Apperence > Theme Options > Import/Export and paste your theme options content from the page you opened a while ago by clicking on ‘From Here’ link appeared when you clicked on ‘Import’ button.

Please copy the theme options content which demo is imported. 

Step 3 : Setup Mega-Menu

1: Once The Pantograph Extensions plugin is activated Mega Menu is available in your admin panel dashboard.

2: Enable Visual Composer for Mega Menu

a. Navigate to Visual Composer > Role Manager
b. In Post Types choose ‘Custom’ and then make sure mega_menu is checked.

 3: Now add mega menu item in Main Menu from the Appearence>Menus and click on Screen Options to expand the options. And check the Mega Menu and CSS Classes item. And select Main Menu from Select a menu to edit: and press Select button.

4: Now you are able to see the Mega Menu in left side, And you can select this mega menu item and click on the Add to Menu button. At now you drag the mega menu item and make a child for a parent menu. In the parent menu need to expand and add css class ‘dropdown megamenu’

Finally, Save Menu from right side.

After completing following steps, you are All done – Have fun!

Make a New Page from Scratch

1. Create your new page and give it a name, e.g : Home and Set the page template to Page WIth VC Template

 

2. You will see new buttons so that you can toggle between classic mode and builder mode as well as a button to take you to the live front-end editor. Now we will use Classic Mode to add elements.

3. By Clicking on Add Element button and can see List of all shortcodes items which can be added and configured on your page.

 

4. Here is 6 tabs are available. All is for showing all elements but our most important tab is by Fluent-Themes Shortcodes. When click on by Fluent-Themes Shortcodes then you can see like the following image

 

5. Click on the Home Slider to Add slide on the top. Just Select a Category and others as needed. Then make sure click on the Save Changes button and Update/Publish your page.

 

6. Follow the images instructions

 

7. Make every addons carefully and finally click on Publish/Update button. Now you homepage is done. If you want to add something new you add.

How to make a Full Width Section

Need to add a post block on the page for showing slider. Just add Home Slider post block using page builder and select a category whose posts will show as single slide. And you can use available settings like Item, Style, Block Color and Height of the Slider

Note: If you want to use full width slider need to chagne an option from Edit Row

Now you should choose Stretch row and content (no paddings) for making it full width slider. Otherwise you can use Default.

Front Page Setup

By default, this theme shows your most recent posts in the front page of your site. But you need a Static Front Page like our demo “Home Page”.

To set this as your homepage, go to Settings > Reading in the dashboard. In the “Front page displays” section check the “static page” option and select the page Home you just created from the dropdown then save the settings.

That page you created and added the homepage page template is now loaded when anyone visits your website homepage.

How to Change Theme Options Like Logo, Favicon, Header, Footer … etc

After installing the theme, you should see a Theme Options menu in Appearance > Theme Options and click on Theme Options menu.

Now you can choose Header Top Bar, Top Bar Menu, Header Default Menu, Logo, Favicon, Single Post Default Style, Category Default Style, Author info Show/Hide, Background Color, Font, Box Style, Breadcrumbs Show/Hide, Social Links, Footer, Footer Logo, Copyright Text from the several option tabs.

How to Setup Header Top Bar?

By default, After install the theme header top area don’t show. But you can give permission to show on the top. Go to Appearance > Theme Options > Header Top Bar and ON the switch for showing top bar.

After showing the top bar add the Background Color, necessary menu item and link from Appearance > Theme Options > Header Top Bar. Of course you have opportunity to add your social media links like above image. Go to Appearance > Theme Options > Social Media and add your desire links.

 

Setup Top Navigation Menu

You need to create Menu from Appereance -> Menus and choose create a new menu option.

 

After that you can choose Pages, Posts, Custom Links(useful for One-Page layout’s menu), Categories from the left column and click Add to Menu button. The selected menus will be added under the Menu Structure. Then you will need to choose Theme Locations under the Menu Settings:

  • Choose Main Menu if you want to use the menu at the top of your website.
  • Choose Footer Menu if you want to use the menu as Quick Links of the Footer.

For More info see the image below:

How to Setup Mega-Menu Dropdown / Multi-Column Dropdown

Step 1: Once The Pantograph Extensions plugin is activated Mega Menu is available in your admin panel dashboard.

 

Step 2: Enable Visual Composer for Mega Menu

1. Navigate to Visual Composer > Role Manager
2. In Post Types choose ‘Custom’ and then make sure maxhost_mega_menu is checked.

 

Step 3: Add a new Mega Menu item

1. Navigate to Mega Menu > Add New
2. Give it a title, lets say “Mega Menu One” item. The title is not used anywhere in displaying the menu.
3. Click on Backend Editor. It will display Visual Composer Backend Editor. We will use this back end editor to build our Mega Menu item.

 

4. Click on ‘Add Element’ and from the elements popup choose ‘Category For Mega Menu’ or ‘Tab Mega Menu’

 

5. For category post the Mega Menu elements settings popup you can fill the form by select a category then click on Save Changes and press the update to save this elements.

 

6. For Tab Mega Menu elements settings popup you need fill the Tab name and select a category for showing posts then click on Save Changes and press the update to save this elements.

 

7. Now create a menu from the Appearence>Menus and click on Screen Options to expand the options. And check the Mega Menu and CSS Classes item.

 

8. Now you are able to see the Mega Menu in left side, And you can select this mega menu item and click on the Add to Menu button. At now you drag the mega menu item and make a child for a parent menu. In the parent menu need to expand and add css class ‘dropdown megamenu’

 

9. Now select a menu like ‘Main Menu’

 

How to use different Header Style?

1. How to make Header Style only for current page?

We have a option to change header style when we are create new page or update existing page. In the right side have an option for Header Style. You can select a style from them.

 

2. How to make Header Style for full website?

We use this feature from Appearance > Theme Options > Header and choose a Website Header Style from the listed item. Possible to change the menu background color for style Four, Five and Seven Header Style from Header Menu Background

 

How to use different Footer Style?

1. How to make Footer Style only for current page?

We have a option to change footer style when we are create new page or update existing page. In the right side have an option for Footer Style. You can select a style from them.

2. How to make Footer Style for full website?

We use this feature from Appearance > Theme Options > Footer/Contact and choose a Website Footer Style from the listed item. And background changing color is available.

 

How to place widgets on your website?

In this important step, we will show you where and how to place widgets. You can place widgets either through the WordPress customizer Appearance => Customize => Widgets or in your WordPress dashboard if you go to Appearance => Widgets. Widgets can be placed simply via drag and drop, so just pull your favored widget to the widget area you like.

Here you can see the available widget areas of Pantograph Magazine & Blog Theme

Sidebar Widgets: Widget area (sidebar right) on single posts, pages and archives.

Footer Widgets: Widget area (In Footer) on all pages.

Footer Social Links: Widget area (In Footer) on all pages.

Note: Just follow the instructions from image and make it perfectly.

 

Others widgets

You can create own widgets for use in Visual Composer, Just take action from Appearance => Sideber, Enter a name and make a new sidebar.

 

At now you can see it Appearance => Widgets. Now add some widget items in your created sidebar

 

Now you can insert it in your Home Page (If you need)

 

Note: For the PantoGraph Featured Posts and PantoGraph Video Posts widgets need to use Featured Post “Yes” for make a post feature and it will show on this widget otherwise widget not show the feature posts. And same issue for the PantoGraph Video Posts, Need to choose video format post and give youtube url in the post content area. After that video will show on the widget.

How to Make Different Category Page Style

By default, this theme shows a default category posts style, But if you want you can choose category post style for the all of category Or Individual categories.

For all category:

If you want all category design will be same then it need to choose from Appearance > Theme Options Choose a Category Style from the General tab.

 

For Individual category:

If you want category design will be always different then it need to choose from Posts > Categories When you add any posts category, you can choose here some of important options which will be visible only for this category.

Like Choose a Template (Which is category page style), Category Color (Background Color only for this category), Single Page Layout (Which is use for a single post view style), Category Title (If you want to give a custome category title), Number of Post to Show (How many post want to show per page for this category), Category Page Image (In the post you can provide featured image and custom image url, So which one want to show on the category page?) Show/Hide Category Title/Description/Breadcrumb ( You can Show/Hide Category Title/Description/Breadcrumb)

 

Same thing for edit any Category

 

How can manage category options?

1. How to Choose category style for all categories?

Go to Appearance > Theme Options > General Now select Category Style.

 

2. How to Choose category Style for current Category?

When add new Category or Edit Category from Posts > Categories choose your desire options

 

3. How to Choose necessary options for current Category?

When add new Category or Edit Category choose your desire options like Header Layout, Single Page Layout, Category Title, Title Style, Show/Hide Category Title, Show/Hide Category Description, Category Page Image and Show/Hide Category Breadcrumb etc.

How can manage single post options?

1. How to Choose Single Post Style for all post?

Go to Appearance > Theme Options > General Now select Single Post Style.

 

2. How to Choose Single Post Style for current post?

When add new post from Posts > Add New just choose a post attributes Template

 

3. How to Manage Post Breadcrumbs?

Go to Appearance > Theme Options > Header Now switch ON to show Post Breadcrumbs on single posts.

 

4. How to Choose Author Info On Single Post?

Go to Appearance > Theme Options > General Now switch ON to show author info on single posts.

 

5. How to make Post as a Featured Post?

When add new post from Posts > Add New just choose Featured Post Yes.

 

6. How to make Primary category for Current Post?

When add new post Posts > Add New you can choose primary category from bottom categories dropdown.

 

7. How to make Video Format Post?

When add new post Posts > Add New just choose Format Video and give an youtube video link in the content box.

 

8. Can i use custom image without feature image?

Yes, You can use custom image URL instead of Feature Image. When add new post give a custom image URL in this field

 

How to use sidebar and change design?

1. How to make sidebar only for current page?

At first need to create sidebar area for add widgets. So please follow the Other Widgets part form Place Widgets. After creating sidebars you can use it on your current pages which is build using page builder. Now you will add Widgetised Sidebar addon. And Select Sidebar which one want to show as sidebar in the current page.

 

Want to change Widgets Design?

We are able to change widgets design for current page. Just follow the below image instruction and make interactive sidebar. This features is bottom of the page editor. So you can change it from page editor. After changing something Publish/Update the current page. No need to explain, It’s simple!

 

2. How to make change default sidebar design?

We are able to change widgets design for all pages. Just follow the below image instruction and make interactive default sidebar. Appearance > Theme Options > Sidebar and make change what you need.

 

How to use a post block properly?

Note: Most of the element is post block. When you want to make a page like Homepage, Must be need to know about the post block. So handle it carefully.

Here is many features are available which is help you to make an interactive website using pantograph wordpress theme. Easy to use this features but need to implement properly. Firstly Add/Edit the post block. At now we can see the options. We are try to explain about available features.

Helpline : You can see the post block layout beside each post block name. So you cam make your desire post block following the beside layout.

  1. Heading : Heading means a post block Headline. You can use or not. If you don’t need Headline keet it blank and save the post blcok.
  2. Select Category : You can choose a category for showing posts in this post block.
  3. Do you want Image Animate? : We can see this effect when mouse hover on the image. If you want click on Yes or don’t need to make change.
  4. Do you want Border? : Border can help you to make box style post block. If you want to make box style then click on Yes checkbox.
  5. Block Border Color : After click on Yes checkbox for make border. Will available border color feature. So if you need to change border color for this post block you can do.
  6. Block Background Color : After click on Yes checkbox for make border. Will available Block Background color feature. So if you need to change Block Background color for this post block you can do. By default its contain white color.
  7. Do you want Next – Prev button? : This feature only for Block 1 and Block 6 which is use for make pagination. If you want you can choose Yes for make Next-Previous pagination
  8. Do you want Tab options? : This feature only for Block 1 and Block 6 which is use for make tab item post category.
  9. Choose Category For Top Tab : After click on Yes checkbox for Tab options, will available this feature to select Top Tab item for this block post.
  10. Choose Category For Top Tab Dropdown : After click on Yes checkbox for Tab options, will available this feature to select Top Tab Dropdown item for this block post.
  11. Choose Background For Tab Dropdown : After click on Yes checkbox for Tab options, will available this feature to select Top Tab Dropdown background color. If text color and background color will same then users can see the text. That’s why we can change the background color for dropdown items.
  12. Large Post ID (Optional) : Most of post block has 1 post as Large. So if you can show a post permanently for this post block you can use a post ID.
  13. Large Post Title Limit In Character (Optional) : Just Character limit for this large post title
  14. Large Post Excerpt Limit In Word (Optional) : Description word limit for the large post.
  15. Post Item : How many post want to show for this post block, You can limit with this.
  16. Another Posts Title Limit In Character (Optional) : Just Character limit for this post block another post title excerpt large post.
  17. Another Posts Excerpt Limit In Word : Description word limit for this post block another post title excerpt large post.
  18. Block color : This option use for change block posts hover color, meta, author link. But you can use individually options for hover, meta and post title. Apply this feature and you can see some of difference on the post block.
  19. Block Heading Color : Block Heading Color can change by this feature
  20. Block Heading Background Color : For the change Heading Background Color. By deafult Heading Background Color is white. When heading color will use white then it will make a conflict. So if you need to use white heading color you can change heading background color. After that you can see the text. Not only for this reason, you can choose heading background color for your necessity.
  21. Block Post Title color : Just for change the post title color, By default this color is black.
  22. Block Text color : You can change the block text color if you need.
  23. Block Link Hover color : You can set Hover Color for all links in this block posts.
  24. Block Date & Meta color : Available option to change Date and Time color
  25. Order By : You can set order by options to show the post according this options
  26. Order : You can set Ascending or Descending order to show the posts

How can manage blocks and widgets blank space?

1. How to add or avoid blank space top or bottom for a widget?

Go to Appearance > Appearance > Widgets Now collapse your widgets and you can add Top and Bottom margin for widgets. So you can recover the blank space using this margin options.

 

2. How to avoid or add empty space between blocks?

We have a option to add empty space between the blocks. And it can help us to make a good looking web layout. Because margin & padding is most important for design. And we can manage this empty space with this empty space element of visual composer.

 

How to make post block like box?

1. How to make post block like a box style?

 

Want to post block like this post block? Okay, Edit your post block and select Yes from“Do you want Border?”

 

2. How to make post block like a box style with background color?

 

Want to post block like this post block? Okay, Edit your post block and select Yes from“Do you want Border?”. After click on Yes button you can see the Block Border Color and Block Background Color. So now you can change the border and background color for this post block.

 

How to make box style page?

1. How to make box style for specific pages?

If you want to make a page boxed style which page will contain all content in container. With your necessary settings, You just click on “Yes” radio button under Do You Want Box Style? and Publish/Update page. At now this page will convert with box style. And it will work only for current page. 

2. How to make box style for full website?

Don’t worry about it. You have a option to make box style for whole website. Which will work box style for all pages in your website. Just make a change ON/OFF switch from Appearence > Theme Options > General “Do You Want Box Style?”

 

How to make Black style page?

1. How to make black background style for specific pages?

For make balck style for specific page, You need to change body background color under Body Background Color and Publish/Update the page. Now this page will convert within black background style. And now you may need to change addons color style according the design which you want to make. Obviously its only not for black style, you can choose any kind of background color

 

2. How to make black background style for full website?

Need to change body background for all pages? You have a option to change body background for whole website. Just choose a background color from Appearence > Theme Options > General “Website Global Body Background”

 

Note: For example, When choose a color from Appearence > Theme Options > General “Website Global Body Background”. It will work for all pages but if individually pages already choose different background color from Body Background Color. At now current page background color will show for this page from Body Background Color.