Masonry Blog Theme Documentation

This article is going to be a detailed documentation guide for our theme “Masonry Blog Theme”.

Kindly activate the “Perfectwpthemes Toolkit” plugin if you are using the theme “Masonry Blog Theme”. If you have already dismissed the recommended plugins prompt message from your dashboard before installing “Perfectwpthemes Toolkit”, then you can install this plugin manually too.

If you are using some other theme and planning to switch to “Masonry Blog Theme”, then we recommend that you install the “Regenerate Thumbnails” plugin. Click here to download it.

Once you have installed it, go to Dashboard > Tools > Force Regenerate Thumbnails and click on “Regenerate All Thumbnails”.

INSTALLATION OF MASONRY BLOG THEME

There are two ways to install the theme. They are as follows:

VIA WORDPRESS DASHBOARD

• Navigate to Appearance > Themes.
• Click on Add New button.
• Click on Upload Theme button.
• Upload the theme file with .zip file format and click on Install Now button.
• After theme installation activate the theme.

Fig: dashboard

Fig: dashboard > appearance > themes > add new

VIA FTP

• Login to your FTP client application.
• Navigate to the WordPress installation folder.
• Navigate to wp-content > themes folder.
• Upload the theme folder into themes folder of server.
• Login to your site’s Dashboard.
• Navigate to Appearance > Themes.
• Activate the theme.

For MAC users when you download a theme file make sure it does not unzip when you click the file. You are supposed to upload the .zip file itself.

Demo Import

You can set up your website using demo import. In order to do this, you need to install the Perfectwpthemes Toolkit plugin. After installing the plugin, please follow the instructions provided below to import the demo content.

• Navigate to Appearance > Import Demo Content
• You’ll see the lists of demos. Click on Live Preview to see the demo.
• Click on Import Demo button to import demo contents of selected demo.

Tips: After importing demo content, check your site and see if any sections or content are missing. If there is content or sections missing, then you have to configure them manually. Look for detailed information about missing content and sections in this documentation.

Setting Reading Screen

It has been noticed that most of the time beginner WordPress users feel confused about the static front page and latest posts setting under Dashboard > Settings > Reading.

• The static front page allows setting any particular page as a homepage.
• Latest posts setting will display your blog posts on the homepage.

Here, since Masonry Blog Theme is a blog theme, you have to use Latest Posts setting. We have provided you with a figure below to guide you through this.

If you need more information about the reading screen, then visit here https://wordpress.org/support/article/settings-reading-screen/

Customizer

We assume that you are well aware of the WordPress Customizer. All the options of Masonry Blog Theme are available in the Customizer.

You can get to the Customizer from Dashboard > Appearance > Customizer

Masonry Blog Theme has all its options and settings available in the Customizer.

Site Header

Options to configure header settings are located at Dashboard > Customizer > Site Header.

You will find the options to change the logo, favicon, top header setting, and header image in the site header.

CONFIGURE LOGO

• To manage Site Logo, navigate to Appearance > Customize > Site Header > Logo section
• There you’ll find different options which are as below: Logo Setup: Under this section, you’ll find options to set Logo, Site Title, Tagline, hide or display both Site Title and Tagline.
• You can even change the font family for the site title.

CONFIGURE FAVICON

• To manage Site Favicon, navigate to Appearance > Customize > Site Header > Site icon.
• Set your site’s favicon and click on Publish button to save.

MANAGE TOP HEADER

To manage the settings for the top header, please use the following guidance.

• Navigate to Dashboard > Customizer > Site header > top header
• You will find option to enable or disable the top header.

The secondary menu at the header top can be managed from Dashboard > Appearance > Menus. Ensure that you select the menu location

Header top menu

Note: The header top menu does not support drop-down items.

Social links are also menu items. To show your social links at the header top, follow the steps given below.

• Navigate to Dashboard > Appearances > Menu
• Create a menu with the name example: Header top social menu
• Select to use custom menu links & enter your social media profile link

• Add the menu item

• Make sure you choose the menu location to “Social menu”

Note: The following are the supported social link menu icons.

• Facebook
• Twitter
• Instagram
• Vk
• Pinterest
• Linked-in
• QQ
• YouTube
• Vimeo
• Vine
• Tumblr
• Reddit
• Digg
• Dribble
• Flickr
• Quora
• Medium
• Behance
• RSS feed (https://yourdomain.com/feeds/)
• Email

Site Pages

To change the option for the site pages and pagination, navigate to Dashboard > Customizer > Site Pages

Site Pages contain options for different pages like blog page, archive/category page, search page, single post, single page, and pagination.

Site Carousel

Site Carousel is also known as a banner slider. This section appears below the header. Follow the instructions below to configure the carousel section:

• Navigate to Dashboard > Appearances > Customizer > Site Carousel
• Enable to show site carousel
• Select category

Note: Site Carousel is used for displaying your posts in the slider. As Site Carousel is not a static banner image, the featured images appearing in the Site Carousel are the featured images for the posts.

Footer & Copyright Information

Footer and copyright information can be changed from Dashboard > Appearance > Site Footer.

Note: The text “Masonry Blog Theme, WordPress theme by Perfectwpthemes” appears in the free version. In case you want to remove that text, we request you to consider purchasing the Masonry Blog Theme Pro Addon Plugin.

Subscription/Newsletter

Masonry Blog Theme is compatible with all the plugins that are designed for the purpose of subscription and newsletter. However, we have styled the MailChimp and MailPoet newsletter in order to make it look better in Masonry Blog Theme.

Please kindly follow the instructions provided below to display the newsletter section on the homepage above the footer, archive page, search page, blog single, and page single.

• Create a newsletter form respective newsletter plugin
• Copy the shortcode provided by newsletter plugin
• Navigate to Dashboard > Appearances > Customizer > Subscription / Newsletter
• Paste the shortcode
• Click save

MailPoet does not allow the use of custom HTML markup. But MailChimp allows you to use custom HTML markup while creating the newsletter form. Here we have 3 markup styles of the MailChimp newsletter as mentioned below.

LAYOUT 1 HTML MARKUP

<div class="subscription-heading">
  <p>
    STAY IN TOUCH TO GET OUR RECENT NEWS
  </p>
  <p class="subscription-heading-title">
    Subscibe Now
  </p>
</div>
<p>
    <label>Email Address</label>
    <input type="email" name="EMAIL" placeholder="Email Address" required="">
</p>
<p>
    <input type="submit" value="Subscribe">
</p>

LAYOUT TWO HTML MARKUP

  <div class="subscription-heading">
  <p>
    STAY IN TOUCH TO GET OUR RECENT NEWS
  </p>
  <p class="subscription-heading-title">
    Subscibe Now
  </p>
</div>

<div class="subscription-form-container subscription-form-layout-one">
  <input type="email" name="EMAIL" placeholder="Email Address" required="">
  <input type="submit" value="Subscribe">
</div>

LAYOUT THREE HTML MARKUP

 <div class="subscription-heading">
  <p>
    STAY IN TOUCH TO GET OUR RECENT NEWS
  </p>
  <p class="subscription-heading-title">
    Subscibe Now
  </p>
</div>

<div class="subscription-form-container subscription-form-layout-two">
  <input type="email" name="EMAIL" placeholder="Email Address" required="">
  <input type="submit" value="Subscribe">
</div>

You can simply copy and paste any of the above HTML markup in order to build a newsletter form in MailChimp. Make sure to use just one layout HTML markup.

Widgets & Widget Areas

In simple terms, widgets refer to the design elements or sections that can be used to develop your website.

Masonry Blog Theme comes with some widgets that are needed in order to develop a blog website. You can find widgets from Dashboard > Appearance > Widgets

Note: Click this image to view its large version

In the case of widgets, there are two things that you need to understand, and these are:

• Widget: Again, In simple word widget are sections or design elements.
• Widget area: Widget area is a place where we place the widgets.

Talking about widgets and widget areas in Masonry Blog Theme, the theme is created with 3 essential widgets and 6 widget areas.

The following are the widgets available in Masonry Blog Theme

MB: AUTHOR WIDGET

Mb: Author widget helps you display a short introduction about the blog author along with his/her picture and social profiles.

Mb: Author widget can be placed in the sidebar, off-canvas sidebar, and footer widget areas.

MB: RECENT POSTS

Mb: Recent posts widget is a simple widget that displays recent posts just like its name.

You can place this widget in the sidebar, off-canvas sidebar, and footer widget areas.

MB: SOCIAL LINK WIDGET

Mb: Social link widget helps you share your social profiles with your blog readers. We do have 2 layouts for this widget.

You can place this widget in the sidebar, off-canvas sidebar, and footer widget areas.

Questions

If you have questions and queries that are not covered by this documentation guide, you can contact us anytime.