SIMPLEX VERTICAL - NEW TEMPLATE FROM SIMPLEXDESIGN

In this post, I would like to show you new template name Simplex Vertical. It's good for magazine, blog.

DEMO | DOWNLOAD

INSTALL INSTRUCTION

1. Download this template. There are one file Simplex Vertical-disqus.xml and a folder name plugins (contain code of elements such as search form, menu navigation, social account...)

2. Open template file in a word editor such as Notepad++

3. We need to edit author biography before uploading template to Blogger.

To edit this post bio

Find this code

<div class='post-author'>

                                        <div class='author-image'>

                                            <img alt='' class='avatar avatar-110 photo' height='110' src='http://1.gravatar.com/avatar/f995c34e6a5cfaff38a739f55d46f5ed?s=110&amp;d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D110&amp;r=G' width='110'/>

                                        </div>

                                        <div class='author-info'>                            

                                            <h4><a href='http://www.thesimplexdesign.com' rel='author'>SimplexDesign</a></h4>                

                                            <p>Praesent posuere libero eu justo tristique, vitae ultricies justo volutpat. Sed pellentesque neque eu neque adipiscing condimentum. In hac habitasse platea dictumst. Aliquam fermentum mollis orci aliquam dictum</p>

                                            <div class='author-connect'>                        

                                                <a class='author-social facebook' href='#'/>        

                                                <a class='author-social twitter' href='#'/>                

                                                <a class='author-social google' href='#'/>        

                                                <a class='author-social tumblr' href='#'/>                                

                                                <a class='author-social instagram' href='#'/>                                                                                

                                            </div>                            

                                        </div>                        

                                    </div>

Edit this code accordingly.

4. Upload template to Blogger.
Do some setting as following: 
Go to Blogger Dashboard -> Setting

• In Language and Formatting -> in Timestamp format, choose the format dd/mm/yyyy.
• In Other ->Allow Blog feed -> Choose Full.

5. In Blogger Dashboard -> choose Layout tab
To add top menu navigation

Click edit link in menu widget

Copy the code in file topmenu.txt (plugin folder) and paste into widget content

6. To edit social navigation

Click edit link in social widget

Copy the code in file social.txt (plugin folder) and paste into widget content

7. To add header

Click edit link in header widget

Upload the logo in widget dialog, remember to check the option "Instead of Title and Description"

8. There are many widget in homepage for displaying content

You can add content into these positions by adding labels into widget content

For example, you want to add content of label "design" into position Block1

Click edit link in Block1 widget

Add label "design" into widget content

9. In this template, there's a sidebar which not displayed in homepage but in single post page and label page. You can add/remove widget in this widget

Single post

Layout tab

10. There are two section in footer, upper footer and lower footer. The upper footer section contain pages widget in left and ads widget in the right. You can add your own advertisment in ads widget.

in homepage

in Layout tab

11. There are exist widget in lower footer section. You can add/remove your own widget into this section. For the search widget, you can copy and paste the code in file search.txt into widget content for making it works.

P/s: If your post has more than one image in a post, it will shown a slider at the top of blog post. To make all images in slider have the same height, you have to use photo editor software to edit their height to be the same.


That's all for this template. Hope it helpful to you.