Blog Designer PRO WordPress Plugin Help Document

Please extract that downloaded zip in your local pc. There was 2 items inside it.

1. 1) blog-designer-pro-document.zip
2. 2) blog-designer-pro.zip

You need to select that blog-designer-pro.zip

1. Installation Via WordPress Admin area

1. Step 1. Log into your WordPress admin area.
2. Step 2. Click on the left side plugin menu.
3. Step 3. Now at the top you can see the Add New button, click the button.
4. Step 4. Again at the top you can see/view Upload Plugin button, click the button.
5. Step 5. Now upload the plugin zip file (blog-designer-pro.zip). After upload, install the zip and click on "Activate Plugin".

2. Installation Via FTP

1. Step 1. Extract Zip file. it will create "Blog Designer Pro" folder with all plugin files & folder inside it. (Remember extracted folder path)
2. Step 2. Using your FTP program, upload the non-zipped plugin folder into the "/wp-content/plugins/" folder on your server.
3. Step 3. Go to Dashboard » Plugins » Installed Plugins and find Blog Designer Pro from plugin list.
4. Step 4. Click on Activate to activate Blog Designer Pro.

Quick guide will help you to easily setup your blog page layout in 3 easy steps witin 1 to 2 minutes. we have make it more easier as you can setup only in 2 Steps. Step 3 only require in special condition.

Please follow this quick steps given below.

Create a new Blog Page

1. Instead of trying on your Blog page or other page, we suggest to first test with new test page for your blog.
   
   1. Create New test page from "Pages" section and give title as "My Blog".
   2. Click on "Publish" button to publish new page.
   3. Right Click on Permalink URL and open it in new tab of browser. (It will be usefull to check page view from front end.)
   

Create a new blog layout

1. 1. Go to Dashboard » Blog Designer » Add Layout
   You will get a page as shown below.
   Now, click on "Select Template" button to get all list of already made blog templates to choose any one.
   
2. 
3. 2. Select any one blog layouts that you want to set for your blog from the given list and follow next points.
4. 
5. 3. Enter "Layout Name" and "Select Post Type"


6. - Add Layout Name (Give name to your blog layout)
7. - Select Post Type (Select the post type from a post type selection)
8. 
9. 4. Select Page for Blog (Your blog design will display with that page)
   
   Click on Drop down list and select page name that we have created in Step 1, in our case its "My Blog" page.
   
   
   NOTE: In "Select Page for Blog" option list if you select any page to display your posts, then you will lose all the content of that selected page (if there is any content already exist with page, please keep backup of it OR user other blank page).
10. 
11. You have done with Quick step settings. (For all other layout options setting click here)
    
    
12. Go to end of the page and click on "Save Settings" button.
13. Now refresh the page that we already have opened in another tab during step 1, in our case its "My Blog" page OR open URL of your Page that you have selected for your blog page at "Select page for blog" option in above step.
14. 
    Congratulations..!! you have configure Blog designer plugin.
    
15. 
    
    

    What if any one wants to display Blog posts or custom post type posts within any page content then you can do it via Blog Designer Shortcode. To do it please follow instruction given in Step 3. Ignore Step 3 if you don't have such requirement.

Please follow below steps.

1. 1. Make sure you have already created blog layouts that you want to use within page content. If not created any Blog layout then go to Step 2.
2. 2. Go to Dashboard » Pages.
3. 3. Open the page in which you want to display blog layouts.
4. 4. Click on the "Add Blog designer shortcode" it will pop up "Select Blog Designer Shortcode" window as per shown bellow.

   5. Select the layout name from the list that you want to display in this page and click on "Insert shortcode" Button.

5. 6. Now you will see that your selected Blog layout's Short code inserted in page content.
6. 

   Click on "Update" and Right Click on Permalink URL and open it in new tab of browser.

1. 
   
   

   Preview Blog Page

   ---

   

   To display Blog layout as above select "Classical Template"

1. Step 1: Go to Dashboard » Blog Designer » Archive Layouts
   Step 2: Click on "Create New Archive Layout" Button.
   Step 3: Click on "Save Changes" button at bottom of page. And Enjoy the Blog Archive Layout.
   
   Click here for more details about "Archive Post Layout"

1. Step 1: To set the Single post Layout in your website.
   Step 2: Go to Dashboard » Blog Designer » Add Single Layout
   Step 3: In that page see the option Override Single Post Design
   Step 4: Check the option Override Single Post Design
   Step 5: Click on "Save Settings" button at bottom of page.
   
   Click here for more details about "Add Single Layout"

1. Step 1. Go to Dashboard » Blog Designer
2. Step 2. Click on "Create New Layout" Button.
3. 
4. Step 3. Fill all the settings as per your preferences.
5. Step 4. Click on "Save Settings" button at bottom of page. And Enjoy the Blog Layout.

1. Blog Designs

Template design option to select the template for creating the blog layout.

1. Boxy Template
2. Boxy Clean Template
3. Brit Co Template
4. Brite Blog Template New!
5. Chapter Template New!
6. Classical Template
7. Cool Horizontal Template
8. Crayon Slider Template
9. Deport Template
10. Easy Timeline
11. Elina Template
12. Evolution Template
13. Explore Template
14. Glossary Template
15. Hoverbic Template
16. Invert Grid Template
17. Lightbreeze Template
18. Masonry Timeline
19. Media Grid Template
20. My Diary Template
21. Navia Template
22. News Template
23. Offer Blog Template
24. Overlay Horizontal Template
25. Pretty Template New!
26. Region Template
27. Sallet Slider Templatee
28. Spektrum Template
29. Story Template
30. Sunshiny Slider Template
31. Tagly Template New!
32. Timeline Template
33. Winter Template

2. Template Color Preset

Color preset to add color combination to your selected template.

3. Layout Name

Unique layout name to identify your blog layout on listing page.

4. Display Timeline Layout

This option provides 3 different values:

• Default Layout: This option displays the timeline layout in 2 columns on the left and right side.
• Left Side: This option displays the timeline layout in a 1 column on the left side.
• Right Side: This option displays the timeline layout in a 1 column on the right side.
• Center: This option displays the timeline layout in a 1 column on the center.

5. Post Display Year Or Months Wise

This option Display If you select Order By Publish Date or Modified Date provides 3 different values:

• Select Option: This option displays default design of blog if order by Publish Date or Modified Date.
• Display Months: This option displays the timeline layout with Month Wise.
• Display Years: This option displays the timeline layout with Year Wise.

6. Year Or Month Display BackGround Color

This option Display If you select Order By Publish Date or Modified Date and you select Post Display Year Or Months Wise Display Year or Display Months

7. Select Post type

The post type selection option will allow you to display your custom post type posts on your page.

8. Select Page for Blog

Page selection option will allow you to display your posts on selected page.

9. Blog Pages Show at Most

Manage the number of posts to display on a single page.

10. Blog Order by

Select the order of display post according to different field like post id, post title, post slug, publish date, modified date. Also allow to select the sort order like ascending or descending, except default sorting selection.

• Blog order by Author name
• Blog order by Post like

11. Pagination Type

This option provides 4 different values:

• No pagination : This option does not display pagination on the page.
• Paged : This option display pagination on the page.
• Load More : This option adds loads more button and via Ajax add more posts on the same page.
• Load On Scroll : This option adds loads posts On page Scroll via Ajax on the same page.

12. Select Post Categories

Select post category or custom taxonomy to display category wise posts on a page.

If you don't check the "Exclude Selected Category" checkbox, it will display only the list of posts that are contained the selected category from the list.

If you check the "Exclude Selected Category" checkbox, it will display only the list of posts that are not contain the selected category from the list.

13. Select Post Tags

Select tags to display tag wise posts on a page.

If you don't check the "Exclude Selected Tag" checkbox, it will display only the list of posts that are contained the selected tags from the list.

If you check the "Exclude Selected Tag" checkbox, it will display only the list of posts that are not contain the selected tags from the list.

14. Select Post Authors

Select authors to display author wise posts on a page.

If you don't check the "Exclude Selected Author" checkbox, it will display only the list of posts that are contained the selected authors from the list.

If you check the "Exclude Selected Author" checkbox, it will display only the list of posts that are not contain the selected authors from the list.

15. Blog Posts Within Time Period

Display posts within in time period like today, tomorrow, this week, last week, next week, this month, last month, next month, between two dates, last N days and next N days.

16. Display Post Category

To display post category, simply select the yes option otherwise no.

• Disable Link for Categories
  • Select checkbox to disable link of category in blog layout
• Display Filter for Categories
  • Select checkbox to display filter by category option in blog page
  NOTE : Display Filter by Categories option displays only in Overlay Horizontal layout and Cool Horizontal layout template.

17. Display Post Tag

To display post tag, simply select the yes option otherwise no.

• Disable Link for Tags
  • Select checkbox to disable link of post tag in blog layout

18. Display Author

To display author of post, simply select the yes option otherwise no.

• Disable Link for Author
  • Select checkbox to disable link of Author in blog layout

19. Display Date

To display date, simply select the yes option otherwise no.

• Disable Link for Publish Date
  • Select checkbox to disable link of date in blog layout
• Display Filter for Date
  • Select checkbox to display filter by date option in blog page
  NOTE : Display Filter by Date option displays only in Overlay Horizontal layout and Cool Horizontal layout template.

20. Display Comment Count

To display total no. of comment according to posts, simply select the yes option otherwise no.

• Disable Link for Comments Form
  • Select checkbox to disable link of comment in blog layout

21. Display Post

To display total no. of like according to posts, simply select the yes option otherwise no.

22. Custom Css

To apply own css to specific content.

Example : If you want dark background in story template same like our live demo then add your css in custom css settings.

Here site-main is the upper level wrapper class of the blog template.
You have to add your blog template's wrapper class to set the background.

1. Hide Timeline Bar

To display Timeline Bar in timeline template, simply select the yes option otherwise no.

2. Active Post

To start timeline layout with some specific post, select that post using Active post.

3. Effect

To set the transition effect in blog layout, select the effect from the already available effects.

4. Item Width

To set the width of the post, use item width option.

5. Image Height

To set the height of the image, use image height option.

6 Margin between Blog Post (px)

To set margin between timeline and blogpost, use margin between blog post option.

7. Enable Autoslide

To slide posts automatic in timeline template, simply select the yes option otherwise no.

8. Scrolling Speed

To set the slide speed use scrolling speed option.

1. Blog Grid Columns

This option provides 3 different values for grid templates:

• 2 Columns : Display posts in 2 columns grid.
• 3 Columns : Display posts in 3 columns grid.
• 4 Columns : Display posts in 4 columns grid.

2. Blog Posts Template Color

To set the color on specific div based on template.

3. Background Color for Blog Posts

To set the post background color using the color picker.

4. Alternative Background Color

To set the alternative post background color, simply select the yes option otherwise no.

5. Choose Alternative Background Color

To set the alternative post background color using the color picker.

6. Story Startup Text

To write Story Startup Text.

7. Story Startup Background Color

To select the startup Background color using the color picker.

8. Story Startup Text Color

To select the startup text color using the color picker.

9. Story Ending Text

To Write Story Ending Text.

10. Story Ending Link

To Add Story Ending Link.

11. Story Ending Background Color

To select the story ending background color using the color picker.

12. Story Ending Text Color

To select the story ending text color using the color picker.

13. Choose Link Color

To select the link color using the color picker.

14. Choose Link Hover Color

To select the link hover color using the color picker.

15. Blog Unique Design

To apply unique design to blog.

16. Select Unique Design for first post or Featured posts

To select unique design apply to first post or featured posts.

17. Blog Grid Height

To set Grid height on specific div on template.

18. Blog Grid Skin

To select Grid skin from available options..

19. Blog Grid column space

To select Grid column space or add space in input box in pixels.

20. Blog Posts hover Background Color

To set the color of post hover background color.

21. Background Hover Color for Blog Posts

To set the color of post hover background color.

22. Choose Dash Color

To select dash color using color picker.

23. Choose Category Background Color

To select the category background color using the color picker.

1. Post Title Link

To enable and disable the link from post title.

2. Post Title Color

To select the post title color using the color picker.

3. Post Title Link Hover Color

To select the post title hover color using the color picker.

4. Post Title Background Color

To select the post title background color using the color picker.

5. Post Title Font Family

To select the post title font family from available font family options. This option updated with Google Font Family Option.

6. Post Title Font Size

To select the post title font size from available font size options.

7. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

1. For each Article in a Feed, Show

To display full text for each post, select full text option, otherwise select the summary option.

2. Show Content From

To display text from post content or from post excerpt.

3. Display HTML tags with Summary

To display First letter of post content large size.

4. First letter of post content as big one

To display First letter of post content large size.

5. First letter of Post Content Font Size

To Select font size of First letter of post content from available font size options.

6. First letter of Post Content Color

To select color of First letter of post content using color picker.

7. First letter of Post Content Font Family

To select the First letter of Post Content font family from available font family options. This option updated with Google Font Family Option.

8. Post Content Font Size

To select the post content font size from available font size options.

9. Post Content Font Family

To select the Post Content font family from available font family options. This option updated with Google Font Family Option.

10. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

11. Post Content Color

To select the post content color using the color picker.

12. Post Content Section Hover Background Color

To select the post content hover background color.

13. Use Read more Color Selection on Date

To apply read more color options same for date.

14. Post Content Length

To Manage your post content length, in words.

15. Read More Text

To Manage your “Read More” text for posts.

16. Read More Text Color

To set the text color for “Read More” text using the color picker.

17. Read More Text Background Color

To set the background color for “Read More” text using the color picker.

1. Display Post Feature Image

To display post feature image on post use display post feature image option.

2. Effect

To apply effect from available options.

3. Post Thumbnail Skin

To select Post Thumbnail Skin from square or circle.

4. Post Image Link

To display blog post feature image as link use post image link option.

5. Select Post Default Image

Select the order of display post according to different field like post id, post title, post slug, publish date, modified date. Also allow to select the sort order like ascending or descending, except default sorting selection.

6. Select Post Media Size

Set the size of Blog Post featured image

7. Add Custom Size

Add the custom height and width of Blog Post featured image

1. Display Custom Read More

Display custom read more text before loop or after loop.

2. Custom Read More Text

Enter custom read more text to show in front.

3. Custom Read More Text Link

Provide link to custom read more text.

4. Open Link

Open custom read more link in new tab or in same tab.

5. Custom Read More Text Color

Apply color to read more text.

6. Custom Read More Text Background Color

Apply background color to read more text.

7. Custom Read More Text Hover Color

Apply hover color to read more text.

8. Custom Read More Text Hover Background Color

Apply hover background color to read more text.

9. Custom Read More Text Font Family

Apply custom read more text font family.

10. Custom Read More Text Font Size

Apply text font size of custom read more text.

11. Custom Read More Text Style Options

Custom read more text style options like font-weight, line height etc.

1. Slider Columns

Set Slider Columns.

2. Slider Image Height

Set Slider height dynamically.

3. Slider Effect

Select Slide effect.

4. Slider to Scroll

Select how many slide scroll.

5. Display Slider Navigation

Display Slider navigations.

6. Select Slider Navigation

Select slider navigation buttons.

7. Display Slider Controls

Display sliders controls.

8. Select Slider Controls

Select sliders controls arrows.

9. Slider Autoplay

Select slider autoplay mode.

10. Slider Autoplay Intervals

Enter autoplay intervals in microseconds. (i.e. 3000).

11. Slider Speed

Enter slider speed in microseconds.

1. Social Share Style

Default and Custom social share button option.

2. Available Icon Themes

Show 10 predefined different social sharing icons for layouts.

3. Shape of Social Icon

To display a social icon in a circle or square shape.

4. Size of Social Icon

To manage the size of a social icon as large or small or extra small.

5. Facebook Share Link

To display a Facebook share option in the posts.To hide Facebook share count, hide Facebook share count option is also available.

6. Google+ Share Link

To display a Google+ share option in the posts.To hide Google+ share count, hide Google+ share count option is also available.

7. Linkedin Share Link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

8. Pinterest Share link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

9. Pinterest Share Button with Featured Image

To display an pinterest share button with featured image in the posts.

10. Twitter Share Link

To display a twitter share option in the posts.

11. Pocket Share Link

To display a pocket share option in the posts.

12. Telegram Share Link

To display a telegram share option in the posts.

13. Share Via Mail

To display a share via mail option in the posts.

14. WhatsApp Share Link

To display whatsApp share option in the posts.

15. Reddit Share Link New!

To display reddit share option in the posts.

16. Social Share Count Position

This option provides 3 different values:

• Bottom : Display share count on the bottom of the icon.
• Right : Display share count on the right side of the icon.
• Top : Display share count on the top of the icon.

You can preview each and every post layout at the time of creation and modify it and save valuable time.

Step 1. Go to Dashboard » Blog Designer » Archive Layouts

Step 2. Click on "Create New Archive Layout" Button. Step 3. Fill all the settings as per your preferences.

Step 4. Click on "Save Changes" button at bottom of page. And Enjoy the Blog Archive Layout.

1. Archive Designs

Template design option to select the template for creating the archive layout.

1. Boxy Template
2. Boxy Clean Template
3. Brit Co Template
4. Brite Blog Template New!
5. Chapter Template New!
6. Classical Template
7. Cool Horizontal Template
8. Crayon Slider Template
9. Deport Template
10. Easy Timeline
11. Elina Template
12. Evolution Template
13. Explore Template
14. Glossary Template
15. Hoverbic Template
16. Invert Grid Template
17. Lightbreeze Template
18. Masonry Timeline
19. Media Grid Template
20. My Diary Template
21. Navia Template
22. News Template
23. Offer Blog Template
24. Overlay Horizontal Template
25. Pretty Template New!
26. Region Template
27. Sallet Slider Templatee
28. Spektrum Template
29. Story Template
30. Sunshiny Slider Template
31. Tagly Template New!
32. Timeline Template
33. Winter Template

2. Template Color Preset

Color preset to add color combination to your selected template.

Unique layout name to identify your archive layout on listing page.

3. Archive Layout Name

Unique layout name to identify your archive layout on listing page.

4. Display Timeline Layout

This option provides 3 different values:

• Default Layout: This option displays the timeline layout in 2 columns on the left and right side.
• Left Side: This option displays the timeline layout in a 1 column on the left side.
• Right Side : This option displays the timeline layout in a 1 column on the right side.

5. Post Display Year Or Months Wise

This option Display If you select Order By Publish Date or Modified Date provides 3 different values:

• Select Option: This option displays default design of blog if order by Publish Date or Modified Date.
• Display Months: This option displays the timeline layout with Month Wise.
• Display Years: This option displays the timeline layout with Year Wise.

6. Year Or Month Display BackGround Color

This option Display If you select Order By Publish Date or Modified Date and you select Post Display Year Or Months Wise Display Year or Display Months

7. Select Archive Type

Select Archive Type option allows you to select Archive Type like Category page, Tag page, Author page, Date page, and Search sage.

You can make 30+ different archive page layout design of above 4 different pages. It's amazing!

8. Blog Pages Show at Most

Manage the number of posts to display on archive pages.

9. Blog Order by

Select the order of display post according to different field like post id, post title, post slug, publish date, modified date. Also allow to select the sort order like ascending or descending, except default sorting selection.

• Blog order by Author name
• Blog order by Post like

10. Pagination Type

This option provides 2 different values:

• No pagination: This option does not display pagination on the archive page.
• Paged: This option display pagination on the archive page.

11. Select Post Tags

Select tags to display tag wise posts on archive page. If Select Archive Type select as Tag.

Select post category to display category wise posts on archive page. If Select Archive Type select as Category.

12. Display Post Category

To display post category, simply select the Yes option otherwise No.

• Disable Link for Categories
  • Select checkbox to disable link of category in blog layout

13. Display Post Tag

To display post tag, simply select the Yes option otherwise No.

• Disable Link for Tags
  • Select checkbox to disable link of post tag in blog layout

14. Display Author

To display author of post, simply select the Yes option otherwise No.

• Disable Link for Author
  • Select checkbox to disable link of Author in blog layout

15. Display Post Published Year

To display Post Published Year, simply select the Yes option otherwise No.

16. Display Post Published Date

To display post published date, simply select the Yes option otherwise No.

• Disable Link for Publish Date
  • Select checkbox to disable link of date in blog layout

17. Display Comment Count

To display total no. of comment according to posts, simply select the Yes option otherwise No.

• Disable Link for Comments Form
  • Select checkbox to disable link of comment in blog layout

18. Display Post Like

To display total no. of like according to posts, simply select the yes option otherwise no.

19. Custom Css

To apply own css to specific content.

1. Hide Timeline Bar

To display Timeline Bar in timeline template, simply select the yes option otherwise no.

2. Active Post

To start timeline layout with some specific post, select that post using Active post.

3. Effect

To set the transition effect in blog layout, select the effect from the already available effects.

4. Item Width

To set the width of the post, use item width option.

5. Image Height

To set the height of the image, use image height option.

6. Margin between Blog Post (px)

To set margin between timeline and blogpost, use margin between blog post option.

7. Enable Autoslide

To slide posts automatic in timeline template, simply select the yes option otherwise no.

8. Scrolling Speed

To set the slide speed use scrolling speed option.

1. Blog Columns

This option provides 3 different values for grid templates:

• 2 Columns : Display posts in 2 columns grid.
• 3 Columns : Display posts in 3 columns grid.
• 4 Columns : Display posts in 4 columns grid.

2. Blog Grid Height

To set Grid height on specific div on template

3. Blog Grid Skin

To select Grid skin from available options.

4. Blog Grid column space (px)

To select Grid column space or add space in input box.

5. Blog Posts hover Background Color

To set the color of post hover background color.

6. Blog Posts Template Color

To set the color on specific div based on template.

7. Background Color for Blog Posts

To set the post background color using the color picker.

8. Alternative Background Color

To set the alternative post background color, simply select the yes option otherwise no.

9. Choose Alternative Background Color

To set the alternative post background color using the color picker.

10. Choose Link Color

To select the link color using the color picker.

11. Choose Link Hover Color

To select the link hover color using the color picker.

12. Story Startup Text

To write Story Startup Text.

13. Story Startup Background Color

To select the startup Background color using the color picker.

14. Story Startup Text Color

To select the startup text color using the color picker.

15. Story Ending Text

To Write Story Ending Text.

16. Story Ending Link

To Add Story Ending Link.

17. Story Ending Background Color

To select the story ending background color using the color picker.

18. Story Ending Text Color

To select the story ending text color using the color picker.

19. Choose Link Color

To select the link color using the color picker.

20. Choose Link Hover Color

To select the link hover color using the color picker.

21. Blog Unique Design

To apply unique design to blog.

22. Select Unique Design for first post or Featured posts

To select unique design apply to first post or featured posts.

1. Display Author Data

To display author data at the top of the author archive page, simply select the Yes option otherwise No.

2. Display Author Biography

To display author biography in author archive page, simply select the Yes option otherwise No.

3. Display Author Title

If you want to add prefix or suffix or both to the author name, simply write the text here.

[author] shortcode will display the dynamic name of author.

4. Author Title Font Size

Select font size of the author title.

5. Author Title font family

Select font family of the author title. This option updated with Google Font Family Option.

1. Post Title Link

Posts title will display with link(permalink) if Enable otherwise display title without link(permalink).

2. Post Title Color

To select the post title color using the color picker.

3. Post Title Link Hover Color

To select the post title hover color using the color picker.

4. Post Title Background Color

To select the post title background color using the color picker. if do not want to set background color in posts title, simply click on clear and leave it blank.

5. Post Title Font Family

To select the post title font family from available font family options. This option updated with Google Font Family Option.

6. Post Title Font Size

To select the post title font size from available font size options.

7. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

1. For each Article in a Feed, Show

To display full text for each post, select full text option, otherwise select the summary option.

2. Show Content From

To display text from post content or from post excerpt.

3. Display HTML tags with Summary

To display First letter of post content large size.

4. First letter of post content as big one

To display First letter of post content large size.

5. First letter of Post Content Font Size

To Select font size of First letter of post content from available font size options.

6. First letter of Post Content Color

To select color of First letter of post content using color picker.

7. First letter of Post Content Font Family

To select First letter of post content font family from available font family options. This option updated with Google Font Family Option.

8. Post Content Font Size

To select the post content font size from available font size options.

9. Post Content Color

To select the post content color using the color picker.

10. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

11. Post Content Section Hover Background Color

To select hover background color for post content.

12. Use Read more Color Selection on Date

To apply read more color options same for date.

13. Post Content Length

To Manage your post content length, in words.

14. Post Content Font Family

To select post content font family from available font family options. This option updated with Google Font Family Option.

15. Read More Text

To Manage your “Read More” text for posts.

16. Read More Text Color

To set the text color for “Read More” text using the color picker.

17. Read More Text Background Color

To set the background color for “Read More” text using the color picker.

1. Display Post Feature Image

To display post feature image on post use display post feature image option.

2. Effect

To apply effect from available options.

3. Post Thumbnail Skin

To select Post Thumbnail Skin from square or circle.

4. Post Image Link

To display blog post feature image as link use post image link option.

5. Select Post Default Image

Select the order of display post according to different field like post id, post title, post slug, publish date, modified date. Also allow to select the sort order like ascending or descending, except default sorting selection.

6. Select Post Media Size

Set the size of Blog Post featured image

7. Add Custom Size

Add the custom height and width of Blog Post featured image

1. Slider Columns

Set Slider Columns.

2. Slider Image Height

Set Slider height dynamically.

3. Slider Effect

Select Slide effect.

4. Slider to Scroll

Select how many slide scroll.

5. Display Slider Navigation

Display Slider navigations.

6. Select Slider Navigation

Select slider navigation buttons.

7. Display Slider Controls

Display sliders controls.

8. Select Slider Controls

Select sliders controls arrows.

9. Slider Autoplay

Select slider autoplay mode.

10. Slider Autoplay Intervals

Enter autoplay intervals in microseconds. (i.e. 3000).

11. Slider Speed

Enter slider speed in microseconds.

1. Social Share Style

Default and Custom social share button option.

2. Available Icon Themes

Show 10 predefined different social sharing icons for layouts.

3. Shape of Social Icon

To display a social icon in a circle or square shape.

4. Size of Social Icon

To manage the size of a social icon as large or small or extra small.

5. Facebook Share Link

To display a Facebook share option in the posts.To hide Facebook share count, hide Facebook share count option is also available.

6. Google+ Share Link

To display a Google+ share option in the posts.To hide Google+ share count, hide Google+ share count option is also available.

7. Linkedin Share Link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

8. Pinterest Share link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

9. Pinterest Share Button with Featured Image

To display an pinterest share button with featured image in the posts.

10. Twitter Share Link

To display a twitter share option in the posts.

11. Pocket Share Link

To display a pocket share option in the posts.

12. Telegram Share Link

To display a telegram share option in the posts.

13. Share Via Mail

To display a share via mail option in the posts.

14. WhatsApp Share Link

To display whatsApp share option in the posts.

15. Reddit Share Link New!

To display reddit share option in the posts.

16. Social Share Count Position

This option provides 3 different values:

• Bottom : Display share count on the bottom of the icon.
• Right : Display share count on the right side of the icon.
• Top : Display share count on the top of the icon.

Show preview also available in archive pages. Click here to Show Preview

Step 1. Go to Dashboard » Blog Designer » Single Layouts

Step 2. Click on "Create New Single Layout" Button. Step 3. Fill all the settings as per your preferences.

Step 4. Click on "Save Changes" button at bottom of page. And Enjoy the Blog Single Layout.

1. Single Post Designs

Single Post design option to select the template for creating the single post layout.

1. Boxy Template
2. Boxy Clean Template
3. Brit Co Template
4. Brite Template New!
5. Classical Template
6. Chapter Template New!
7. Deport Template
8. Evolution Template
9. Glossary Template
10. Invert Grid Template
11. Lightbreeze Template
12. Media Grid Template
13. Navia Template
14. News Template
15. Offer Blog Template
16. Region Template
17. Spektrum Template
18. Tagly Template New!
19. Winter Template
20. Timeline Template
21. Pretty Template New!
22. Cool Horizontal Template
23. Easy Timeline Template
24. Overlay Horizontal Template
25. Story Template
26. Elina Template
27. My Diary Template
28. Masonry Timeline Template
29. Explore Template

2. Template Color Preset

Color preset to add color combination to your selected template.

3. Single Layout Name

Unique layout name to identify your single layout on listing page.

4. Override Single Page Design

To Override the design of Single Page.

5. Select Single Page Override Type

This option allow you to select single page override type based on category, tag.

• All Posts: Common setting for all posts.
• Category Wise : Single post setting based category selection.
• Tag Wise : Single post setting based on tag selection.

6. Display Post Category

To display post categories on single post page.

• Disable Link for Categories
  • Select checkbox to disable link of post category in single layout

7. Display Post Tag

To display post tags on single post page.

• Disable Link for Tags
  • Select checkbox to disable link of post tag in single layout

8. Display Author Tag

To display Author name on single post page.

• Disable Link for Author
  • Select checkbox to disable link of post author in single layout

9. Display Post Published Year

To display post published year on single post page.

10. Display Post Published Date

To display post published date on single post page.

• Disable Link for Publish Date
  • Select checkbox to disable link of post date in single layout

11. Display Comments

To display post comments count on single post page.

• Disable Link for Comments Form
  • Select checkbox to disable link of post comment in single layout

12. Display Post Thumbnail

To display Post Thumbnail on single post page.

13. Display Post Like

To display total no. of like according to posts, simply select the yes option otherwise no.

14. Display Post Views

Display post views in single post layouts, Show Today's view or all views in single layout.

15. Custom CSS

To apply own css to specific content.

1. Background Color for Single Posts

To select the single post's background color using the color picker.

2. Single Post Template Color

To set the color on specific div based on single post template.

3. Choose Link Color

To select the link color using the color picker.

4. Choose Link Hover Color

To select the link hover color using the color picker.

5. Choose Category Background Color

To select the category background color using the color picker. This option available only in Winter Template.

6. Story Startup Text

To write Story Startup Text.

7. Story Startup Background Color

To select the startup Background color using the color picker.

8. Story Startup Text Color

To select the startup text color using the color picker.

1. Post Title Color

To select single post title color using the color picker.

2. Post Font Size

To select font size for single post title.

3. Post Title Font Family

To select font family for single post title. This option updated with Google Font Family Option.

4. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

1. First letter of post content as big one

To display First letter of post content large size.

2. First letter of Post Content Font Size

To Select font size of First letter of post content from available font size options.

3. First letter of Post Content Color

To select color of First letter of post content using color picker.

4. First letter of Post Content Font Family

To select the First letter of Post Content font family from available font family options. This option updated with Google Font Family Option.

5. Post Content Font Size

To select font size for single post content.

6. Post Content Font Family

To select the single post content font family from available font family options. This option updated with Google Font Family Option.

7. Post Content Color

To select single post content color using the color picker.

8. Post Title Font Style Options

• Font Weight : To select the post title font weight from available font weight options.
• Line Height : Add line height to the post title.
• Italic Font Style : To apply italic font style to the post title.
• Text Transform : To select the post title font transform from available font transform options.
• Text Decoration : To select the post title font decoration from available font decoration options.
• Letter Spacing : Add letter spacing in pixels to the post title.

1. Display Post Next/Previous Navigation

To display navigation(Next/Previous) section in single post, simply check Yes option otherwise No.

2. Display Post Navigation Title

To display navigation post's title in single post, simply check Yes option otherwise No.

3. Display Post Navigation Feature Image

To display post navigation featured image, simply check Yes option otherwise No.

4. Display Post Navigation Date

To display post navigation date, simply check Yes option otherwise No.

To change date format go to Dashboard » Settings » General » Date Format.

1. Display Related Post On Single Page

Enable if display Related Post On Single Page.

2. Related Post Title

Customize your related post title.

3. Related Post Title Font Size

Select font size to change related post title size.

4. Related Post Title Font Family

Select font family to change related post title font. This option updated with Google Font Family Option.

5. Related Post Title Color

Select related post title color.

6. Show Related Posts By

Display Related Posts By Tag or category wise.

7. Number Of Related Posts

Display Number Of Related Posts on single page and options are 2 post,3 post, or 4 post.

8. Post Content Length

Display number of words display in post content.

1. Social Share Style

Default and Custom social share button option.

2. Available Icon Themes

Show 10 predefined different social sharing icons for layouts.

3. Shape of Social Icon

To display a social icon in a circle or square shape.

4. Size of Social Icon

To manage the size of a social icon as large or small.

5. Facebook Share Link

To display a Facebook share option in the posts.To hide Facebook share count, hide Facebook share count option is also available.

6. Twitter Share Link

To display a twitter share option in the posts.

7. Google+ Share Link

To display a Google+ share option in the posts.To hide Google+ share count, hide Google+ share count option is also available.

8. Linkedin Share Link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

9. Pinterest Share link

To display a Linkedin share option in the posts.To hide Linkedin share count, hide Linkedin share count option is also available.

10. Pinterest Share Button with Featured Image

To display an pinterest share button with featured image in the posts.

11. Pocket Share Link

To display a pocket share option in the posts.

12. Telegram Share Link

To display a telegram share option in the posts.

13. Share Via Mail

To display a share via mail option in the posts.

14. WhatsApp Share Link

To display a share via whatapp option in the posts.

15. Reddit Share Link New!

To display reddit share option in the posts.

16. Social Share Count Position

This option provides 3 different values:

• Bottom : Display share count on the bottom of the icon.
• Right : Display share count on the right side of the icon.
• Top : Display share count on the top of the icon.

17. Social Share Text

To display a social icon share text with font awesome icon.

18. Social Share Text Font

Select font family for social share text.

19. Social Share Text Size

Select font size for social share text.

In Blog designer plugin, the design of archive post is according to WordPress default theme. It may not design proper with your current theme. To make it compatible with your current theme, Blog designer plugin gives facility to override archive post design.

Follow the below steps to override template

Step 1: Create new folder named 'bdp_templates' in your current active theme.
Step 2: Create new folder named 'archive' in newly created 'bdp_templates' folder.
Step 3: Copy your theme's archive.php file in above created 'archive' folder and remove code from main while loop start(while (have_posts()) : the_post();) to end(endwhile;).
Step 4: Open file archive.php from plugin path(wp-content/plugins/blog-designer-pro/bdp_templates/archive/archive.php). Copy code from main area(<main id="main" class="site-main" role="main">) and paste it in place of removed code of newly created file.

In Blog designer plugin, the design of single post is according to WordPress default theme. It may not design proper with your current theme. To make it compatible with your current theme, Blog designer plugin gives facility to override single post design.

You can override a single post file by one of the two methods. Follow the below steps to override template

1: Override file using Plugin Editor

Step 1: Go to Dashboard » Blog Designer » Single File Override.

Step 2: Click on Copy File to theme Button, it will create single.php file in bdp_templates/single folder in your currently active theme

Step 3: Open created single.php file from theme path(wp-content/themes/your_active_theme/bdp_templates/single/single.php). Remove code before and after the main area(<main id="main" class="site-main" role="main">).( Delete the code OutSide the <main id="main" class="site-main" role="main"> )

Step 4: Open your theme's single.php file copy code before the main while loop start(while (have_posts()) : the_post();) and after the loop end(endwhile;).

Step 5: Paste it in place of removed code from newly created file.

2: Override file Manually

Step 1: Create new folder named 'bdp_templates' in your current active theme.

Step 2: Create new folder named 'single' in newly created 'bdp_templates' folder.

Step 3: Copy your theme's single.php file in above created 'single' folder and remove code from main while loop start(while (have_posts()) : the_post();) to end(endwhile;).

Step 4: Open file single.php from plugin path(wp-content/plugins/blog-designer-pro/bdp_templates/single/single.php). Copy code from main area(<main id="main" class="site-main" role="main">) and paste it in place of removed code of newly created file.

Checkout theme hacks: https://www.solwininfotech.com/knowledgebase/new-awesome-list-100-theme-hacks-free-blog-designer-pro-users/

1. Import

1. Step 1. Go to Dashboard » Blog Designer » Import Layouts.
2. Step 2. Now, Choose .txt file to import layouts.

2. Export

1. Step 1. Go to Dashboard » Blog Designer » Layouts.
2. Step 2. Now, Check which layout you want to Export Layout and select the export option as shown in below images.

1. How can I get the Blog Designer Plugin design instead of theme design for the blog section on the blog page?

Step 1. Go to Dashboard » Settings » Reading.

2. Is it possible to override archive page with a blog designer pro? How?

Yes, Create a directory in theme directory name with bdp_templates, create another directory archive within bdp_templates directory, then simpley copy paste archive.php from the plugin directory to theme directory.

3. Can I apply this blog designer only for my hot categories?

Yes, there is one backend option to select multiple categories, blog designer shortcode will show post that selected categories only.

4. Is there any social option available as I can show social share button on my blog page with every post?

Yes, Social share setting available. With the help of this settings you can get multiple social share variation according your design.

5. Can I control my content length on blog page?

Yes, you can. “Post Content Length” option will give you ability to control your content characters on blog page.

6. I want to hide post details like post author, post date, etc., Can I?

Yes, There is “General Settings” panel where you can manage your post details as you want to show or not.

7. Can I manage my “Read More” text on blog page?

Yes, you can change the text like View More, Continue Reading and you can decorate it also. i.e. font-size, background color, etc.

8. Can I modify my single blog page with blog designer?

Yes, there is a single layout page available. You can use that single page design out of 26 single post layout.

9. What is the key feature of single blog post?

There are lots of features. i.e. Related Post, Custom Post Support, Single Post Layout, Author Biography Management, etc.

10. I have one custom post type “movie”. Can I use blog designer for that?

Yes, Custom post type selection feature gives a capabilities to show your listing with any custom post type.

11. I have one website with blog designer shortcodes, Can I copy from that?

Yes, we have import/export feature to copy blog designer layout.

12. Can you please give me a list as which blog templates are providing me Timeline features?

Cool Horizontal, Overlay Horizontal, Easy Timeline, Story and Timeline templates are providing Timeline Layout.

13. Can you please give me a list as which blog templates are providing me Grid features?

Hoverbic, Explore, Glossary, Brit Co, Boxy and Boxy Clean Templates are providing Grid Layout.

14. I am getting message like "Sorry, you are not allowed to access this page." while accessing Blog Designer panel. How can I resolve it?

There is a major update available with version 1.5. According to that changes, some backend links are updated with new URL. Please try "http://yoursitename.com/wp-admin/admin.php?page=layouts" to access Blog Designer panel.

15. How do I make the full post display in the same/similar theme as the blog page?

You have created blog layouts for your blog page only. For full post display or for single post display same like blog page, you need to create "Single Layouts". That will give you total control of your single post pages also.

You can update Blog Designer Plugin using below way.

Update plugin manually

1. Step 1 :  Download Blog Designer plugin zip file from your members area at codecanyon website.
2. Step 2 :   Please extract that downloaded zip in your local pc. There was 2 items inside it.
   1. 1) blog-designer-pro-document.zip
   2. 2) blog-designer-pro.zip
   You need to select that blog-designer-pro.zip
3. Step 3 :  Extract that blog-designer-pro.zip file. It will create "Blog Designer Pro" folder with all plugin files & folder inside it.
4. Step 4 :  Using FTP or Cpanel, upload the non-zipped plugin folder into the "/wp-content/plugins/" folder on your server.
5. Step 5 :  Select override option once it will ask by FTP or cPanel.
6. Step 6 :  That's done. Enjoy new Blog Designer PRO version!!

We have already created 100+ theme hacks for you. Please go to knowledgebase link to download your theme's Blog Designer PRO copy.

You just need to find out your active theme name from below list.

We would like to thank you for using our Blog Designer Pro Plugin! If you have any difficulties with Blog Designer Pro Plugin or need any additional service, do not hesitate to contact us. We provide priority support with our all premium WordPress themes and plugins.

Just contact us on support.solwininfotech.com

We are very happy to assist you!

I've used the following jQuery Plugins as listed.

• Chosen - Chosen is a jQuery plugin that makes long, unwieldy select boxes much more user-friendly.
• SocialShare.js - jQuery plugin for creating custom like buttons and like counters.
• FlexSlider - An awesome, fully responsive jQuery slider plugin.
• Aristo - The "Aristo" theme for Cappuccino ported to a jQuery UI Theme.
• Font Awesome - The iconic font and CSS toolkit.