Create an Attractive Landing Page on Your Blogger Blog
An attractive landing page will certainly boost your blog's or Site's SEO. Why? When site owners plan for their site branding and new product launch, a relevant page with highly convincing article will prove very important role. The landing page will help in gathering more subscribers, promotion, call-to-actions, affiliate sales and much more. 

The best example of an attractive landing page is mostly at a home page of your site. Most of the new bloggers have their recent post's links on their home page but looking at current marketing scenario, it is highly recommended to use home page for business branding. Why would someone type in and visit your site unless it is not enough popular in the community?

Landing Page Design
Considering WordPress, there is a great opportunity to create an easy landing page without any input, but if you are on blogger, there needs some workaround.

Firstly create a new page as normally you do and make it fully convincible with attractive images or a layout of your business choice.

Turn off the comments in Settings while making a post.

Now go to Blogger dashboard and click on Settings > Search Preferences.

Look for Errors and Redirections and click on Custom Redirects.

In the ‘Form’ field enter a slash '/' and in the 'to' field enter destination of your post.


Enter the following line in 'to' tab.


Blogger Custom Redirection Settings

Click on Save and follow to next step.

With this, your home link will direct to your new custom landing page. Wait. Don't you think, you should make it fully customized by hiding those sidebars etc? On landing page, they are not required.

Once again open your post > edit and click on HTML option.just enter below codes at the start of your text. 

#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer 
{ display:none !important;}
#main-wrapper { width:98%!important;}
.post { width:98%!important; }
Again go to HTML mode while editing your post and enter below set of codes at the end.
<style type='text/css'>
img.recent_thumb {padding:0px;width:55px;height:55px;border:0;
.recent_posts_with_thumbs {float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 
0px;padding: 0;font-size:14px;}
ul.recent_posts_with_thumbs li {padding-bottom:0px;padding-top:5px;min-height:65px;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs strong {font-size:10px;}</style>
<script style='text/javascript' src='
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 95;</script>
<script src='
This will add recent posts widget to work at the end of your landing page so that readers will not miss the current updates from your blog.
Code source:

Take a look at simple yet powerful landing page of Lisa

No comments:

Post a Comment

No more post found.