Using Print to Establish Your Online Blog or Business

Printed marketing materials are used on a daily basis by hundreds of thousands of businesses and corporations around the globe, and with great success. But one area which often seems to forget about printed marketing is the online industry. Bloggers and online businesses alike tend to go straight for the digital marketing methods, rather than utilising print – this could be a big mistake.

Marketing with printed materials has a few great benefits over digital marketing, one of which is its cost effectiveness. You can print business cards for as little as around 10c per card, making them a very cheap way of advertising.

Like with any method of advertising, your advert needs to stand out from the rest in order to do its job properly. If it doesn’t stand out, and if it isn’t memorable, then people are not going to look at it, let alone follow it up by visiting your website. It can be hard to think of new and original ideas for your designs with so many out there already. I’ve collected a number of awesome designs to give you some inspiration for your own design projects. Whatever you’re designing, the examples below should certainly help to get your creative juices flowing freely!


Hopefully these materials have given you some ideas on how best to advertise your blog or online business through printed materials. As you can see from the designs, the way in which the information is presented on them, and the designs themselves, have more of a personal feel than a corporate one, and as their often advertising personal blogs, they include that bloggers social accounts too; Twitter, Facebook, Google + etc. So, remember to incorporate those points into your own designs. When it comes time to print your design, you’ll probably want to use an online printing company, as they tend to be cheaper and quicker than offline companies. There are companies like www.nextdayflyers.com which allow you to print any type of marketing material online through their website. Whether you’ve chosen to go with business cards, or flyers, or brochures, or some other type of material, you’ll be able to get it printed with them, and at super high quality.


Author Bio: Nathan Daniels is a regular contributor of technology, creativity, design and print posts to this blog and other top blogs around the web. When he’s not blogging he enjoys keeping up to date on the latest in gadgets and technology, and travelling around Europe!

Stylish Popular Post Widget with 3D Effect for Blogger

Want to add stylish popular post for blogger. So this post is for you. Today I share 3D effect popular post widget. I have posted moving popular post widget before. To add 3D effect popular post widget follow below steps:-


LIVE DEMO

1. Login to your Blogger account.

2. Click on Dashboard >> Layout.

3. Click on Add a Gadget and Choose Popular Posts (If you already have this gadget skip this step)

4. After adding Popular Post Gadget Add a Gadget again Select HTML/Javascript widget.

5. Paste the following code and Save.

<style type="text/css">
.cube { width: 300px; height: 400px;}
a img { border: none; }
#linksCube img { width: 100%; height: 100%; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script src="https://sr-site.googlecode.com/files/sr-site-image.js" type="text/javascript"></script>
<script charset="utf-8" type="text/javascript">
$(function () {
$('.popular-posts ul').abupopularcube();
});

</script>
<script src="https://sr-site.googlecode.com/files/popularpost.js" type="text/javascript"></script>

6. You are done.

Add CSS3 3D Style Verticle Menu to Blogger Blog

Want add CSS3 3D Style Verticle Menu to Blogger blog. CSS3 3D Style Verticle Menu make blog more visitor friendly. Today I share CSS3 3D Style Verticle Menu to Blogger. To add just make below steps properly.



1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Find out (Press Ctrl+F) the Code   ]]></b:skin>

6. Now Just before the  ]]></b:skin> Paste the following Code

#nav12,#nav ul {
background-color: #8899AA;
list-style: none outside none;
margin: 0;
padding: 0;
}
#nav12 {
display: block;
padding: 5px;
position: relative;
width: 112px;

-moz-perspective: 200px;
-ms-perspective: 200px;
-webkit-perspective: 200px;
-o-perspective: 200px;
perspective: 200px;
}
#nav12 ul {
left: -9999px;
opacity:0;
overflow: hidden;
padding: 5px;
position: absolute;
top: -9999px;

-moz-transform: rotateY(70deg);
-ms-transform: rotateY(70deg);
-o-transform: rotateY(70deg);
-webkit-transform: rotateY(70deg);
transform: rotateY(70deg);

-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-o-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;

-moz-transition: -moz-transform 0.3s linear, opacity 0.3s linear;
-ms-transition: -ms-transform 0.3s linear, opacity 0.3s linear;
-o-transition: -o-transform 0.3s linear, opacity 0.3s linear;
-webkit-transition: -webkit-transform 0.3s linear, opacity 0.3s linear;
transition: transform 0.3s linear, opacity 0.3s linear;
}
#nav12 li {
background-color: #FFFFFF;
position: relative;
}
#nav12 > li {
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
#nav12 li a {
background-color: #AABBCC;
border-color: #DDDDDD #555555 #555555 #DDDDDD;
border-style: solid;
border-width: 1px;
color: #000000;
display: block;
font-size: 15px;
padding: 8px 10px 8px 5px;
text-decoration: none;
width:95px;

-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
transition: all 0.2s linear;
}
#nav12 li:hover > a {
background-color: #8899AA;
border-color: #8899AA;
color: #FFFFFF;
}
#nav12 li:hover ul.subs {
left: 114px;
opacity:1;
top: 0;

-moz-transition-delay: 0.3s;
-ms-transition-delay: 0.3s;
-o-transition-delay: 0.3s;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;

-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
-o-transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
#nav12 ul li {
width: 100%;
}

7. Go back Blogger and click Layout than Add Gadget >> HTML/Javascript.

8. Paste the below code and Save.

<div class="container">
<ul id="nav12">
<li><a href="http://www.sr-site.com/">Home</a></li>
<li><a href="#">Menu 1</a>
<ul class="subs">
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 3</a></li>
<li><a href="#">Submenu 4</a></li>
<li><a href="#">Submenu 5</a></li>
</ul>
</li>
<li><a href="#">Menu 2</a>
<ul class="subs">
<li><a href="#">Submenu 2-1</a></li>
<li><a href="#">Submenu 2-2</a></li>
<li><a href="#">Submenu 2-3</a></li>
<li><a href="#">Submenu 2-4</a></li>
<li><a href="#">Submenu 2-5</a></li>
<li><a href="#">Submenu 2-6</a></li>
<li><a href="#">Submenu 2-7</a></li>
<li><a href="#">Submenu 2-8</a></li>
</ul>
</li>
<li><a href="#">Menu 3</a>

9. Replace your url where need. You are done.

Add Heart Style Social Sharing Widget to Blogger Blog

Want add Social Sharing Widget to Blogger blog. Social share button make blog more visitor friendly. Today I share Heart Style Social Sharing Widget to Blogger. To add just make below steps properly.


LIVE DEMO

1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Find out (Press Ctrl+F) the Code   ]]></b:skin>

6. Now Just before the  ]]></b:skin> Paste the following Code

.sr-site{
list-style-type:none;
margin:0;
padding:0;
}
.sr-site li{
display:inline;
width: 60px;
height:60px;
}
.sr-site li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.sr-site li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}

7. Go back Blogger and click Layout than Add Gadget >> HTML/Javascript.

8. Paste the below code and Save.

<ul class="sr-site">
<li><a href="http://www.plus.google.com/10795529879"><img src="http://3.bp.blogspot.com/-3PDKY8qjMTM/UOkQYZdIDiI/AAAAAAAAABA/MwN8lfOFaxU/s1600/sr-site.com-google-plus.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.facebook.com/sr-site"><img src="http://3.bp.blogspot.com/-g_pRON8uUhY/UOkQnfp4zHI/AAAAAAAAABI/1WggnpfpmdU/s1600/sr-site.com-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.Stumbleupon.com/Username"><img src="http://2.bp.blogspot.com/-BoupImO2KCw/UOkQ4pikWTI/AAAAAAAAABQ/6g6czm6FfWI/s1600/sr-site.com-stumble.png" title="Add to Stumbleupon" /></a></li>
<li><a href="http://www.twitter/sr-site"><img src="http://3.bp.blogspot.com/-2TDdtTn6q6o/UOkRNDER27I/AAAAAAAAABY/0t04k6iQqCY/s1600/sr-site.com-twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds.feedburner.com/Sr-Site"><img src="http://4.bp.blogspot.com/-nXGNtJaCM1Q/UOkRf26OJCI/AAAAAAAAABg/UfZ6volpx7c/s1600/sr-site.com-rss.png" title="Add RSS Feed" /></a></li>
</ul>

9. Replace your url where need. You are done.

Add Sliding Social Sharing Widget to Blogger Blog

Do you want to Add Sliding Social Sharing Widget to Blogger Blog. It is a excellent widget. It has a nice hover effect. You can link your Rss Feed, Facebook, Twitter and Google plus by this widget. Let go to see.


LIVE DEMO

1. Login to your Blogger account.

2. Click on Dashboard >> Layout.

3. Click on Add a Gadget.

4. Select HTML/Javascript widget.

5. Paste the following code and Save.

<style>
.socialsharing a {
display:block;
height:50px;width:50px;padding:0 4px;float:left;
background:transparent url(http://4.bp.blogspot.com/-UTkPtPsw9bY/UKRoAPEVZ9I/AAAAAAAAFnM/qDPvUxpNfqM/s1600/Sharing+buttons.png) no-repeat;
-webkit-transition: ease-in 0.2s all;
-moz-transition: ease-in 0.2s all;
-o-transition: ease-in 0.2s all;
-ms-transition: ease-in 0.2s all;
transition: ease-in 0.2s all;
cursor:pointer;
}
.socialsharing a.googleplus {
background-position: 0px -58px;
}
.socialsharing a.googleplus:hover {
background-position: 0px 0px;
}
.socialsharing a.twitter {
background-position: 0px -290px;
}
.socialsharing a.twitter:hover {
background-position: 0px -232px;
}
.socialsharing a.facebook {
background-position: 0px -406px;
}
.socialsharing a.facebook:hover {
background-position: 0px -348px;
}
.socialsharing a.rss {
background-position: 0px -174px;
}
.socialsharing a.rss:hover {
background-position: 0px -116px;
}
</style>
<br />
<div class="socialsharing">
<a class="rss" href="RSS Link" rel="external nofollow" target="_blank"></a>
<a class="googleplus" href="Google profile link" rel="external nofollow" target="_blank"></a>
<a class="facebook" href="Facebook page Link" rel="external nofollow" target="_blank"></a>
<a class="twitter" href="Twitter Link" rel="external nofollow" target="_blank"></a>
</div>

6. Replace with your URLs where highlight with red color text. You are Done.

Stylish Rss Feed, Facebook, Twitter, Email Subscription Widget to Blogger

Do you want to add Excellent/Stylish Rss Feed, Facebook, Twitter, Google Plus, Email Subscription Widget to Blogger? By this widget visitor can subscribe to your blog and get update easily. To do it just follow the below steps:

1. Login to your Blogger account.

2. Click on Dashboard >> Layout.

3. Click on Add a Gadget.

4. Select HTML/Javascript widget.

5. Paste the following code and Save.

<style>
#topbox{width:250px;border:1px solid #a1a1a1;background-color:#ffffff;padding-bottom:15px;padding-top:5px;}
#news-letter{clear:both;padding-top:10px;}
.msg-box{float:left;width:50px;height:54px;margin-right:9px;padding-top:5px;background: url(https://lh4.googleusercontent.com/-u3si_YxFoT0/TnmfA71Ti3I/AAAAAAAABko/arZLNvC3FYs/s800/mail-box.png) no-repeat;}
.news-headline{position: relative;z-index: 999;font-size: 18px;padding-bottom:10px;font-weight:bold;}
</style><br />
<div id="topbox">
<center>
<div class="news-headline" color:="color:">
Get Free Email Updates
</div></center>
<center>
<table border="0">
<tbody>
<tr>
<td style="padding-right: 4px;"><a href="http://twitter.com/sr-site" target="_blank" title="Follow Me On Twitter">
<img src="http://3.bp.blogspot.com/-eI8n1Jh6jf4/UOZzPx91ppI/AAAAAAAAAAg/2yFDic1IfIQ/s1600/sr-site.com-twitter-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://feeds.feedburner.com/sr-site" target="_blank" title="Subscribe Via RSS">
<img src="http://2.bp.blogspot.com/-mFLdUiN1sHA/UOZzwc2jkUI/AAAAAAAAAAo/WzWlKQl1LK8/s1600/sr-site.com-rss-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://www.facebook.com/sr-site" target="_blank" title="Find Us On Facebook">
<img src="http://3.bp.blogspot.com/-Kyds2BYKC6Y/UOZ0Fr_CvLI/AAAAAAAAAAw/d7nOCHKBNco/s1600/sr-site.com-facebook-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="https://plus.google.com/107955298793879607964" target="_blank" title="Add me on Google+">
<img src="http://4.bp.blogspot.com/-zKLII3_ddyA/UOZ0Y2YCXBI/AAAAAAAAAA4/ShUZhjCrt2s/s1600/sr-site.com-google-plus-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://youtube.com/username" target="_blank" title="Add To Technorati">
<img src="http://1.bp.blogspot.com/-Rqrlw-wOjWs/UOZ01qUOm9I/AAAAAAAAABA/bk2qxfeVzBw/s1600/sr-site.com-youtube-icon.png" style="height: 25px; width: 25px;" /></a>
</td></tr>
</tbody></table>
</center>
<div id="news-letter">
<span class="msg-box"></span>
<b>Sign up for newsletter</b>
<br />
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=sr-site', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="ebutton3" gtbfieldid="2" maxlength="100" name="email" onfocus="this.value = '';" size="25" style="color: #333333; font-size: 11px; height: 21px; width: 130px;" type="text" valign="middle" value="Enter your email address" />
<input name="uri" type="hidden" value="sr-site" />
<input name="loc" type="hidden" value="en_US" />
<input class="ebutton2" id="submit" style="font-size: 11px;" type="submit" value="Send" />
</form>
</div>
</div>
<div class="clear">
</div>
<br />
<div class="clear">
</div>

Note: Replace your site where need replacing sr-site.

How to Make Blogger Blog Post Title SEO Friendly

Do you want to make your blogger post title seo friendly? If your post title be seo friendly you will get more visitor from search engine. Post Title increase visitor so that improve your page rank. But the blogger templates are not search engine optimized that is they are not simply compatible to boost up your page rank. Do make your blogger template post title seo friendly just fulfill below steps:



1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Then search for this tag   <data:blog.pageTitle/>

Normally it is located in "head" section.

<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>

6. Replace the above code with the following code:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

I hope this trick will help you to drive more traffic to your Blogs or Websites. It also increases SEO of your Blogger Blog. Post a comment if you have any query. Thanks a lot !!!! To more How To Make a Blogger Template SEO Friendly

Show Blog Post Title First on Search Engine || SEO Tips

Do you want show blogger post title first in search result? If your post title show first visitor will know something to see search result. So, they will not jump to others site. It will confirm you more visitor. To do just follow the below steps:



1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Then search for this tag   <data:blog.pageTitle/>

Normally it is located in "head" section.

<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>

6. Now if you want to show only Blog Post Title then replace the above tag with following code:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

7. If you want to Show Blog Post Title First + then Blog Title, replace the tag with the following code.

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/> ~ <data:blog.title/></title>
</b:if>
I hope this trick will help you to drive more traffic to your Blogs or Websites. It also increases SEO of your Blogger Blog. Post a comment if you have any query. Thanks a lot !!!! To more How To Make a Blogger Template SEO Friendly

How To Make a Blogger Template SEO Friendly

There are many blogger template you get but most them are not seo friendly. Most of those template are designed by unknown designer who don't know seo properly. Don't worry. Today I show how to make your blogger template seo friendly. Just fulfill below jobs.
1. Login to your Blogger Account.

2. From Dashboard >> Tamplate >> Edit HTML >> Proceed.

3. Don't forget to backup your template first.

4. Check the Expand Widget Templates box.

5. Find out (Press Ctrl+F) the Code  <head>

6. Now Just below the <head> Paste the following Code

<meta content='text/html; charset=utf-8' http-equiv='Content-Type'/>
<meta content='Your Site Description Here' name='description'/>
<meta content='Your Site Keywords Here' name='keywords'/>

Note: Replace Your Site Description Here with your site description but make sure it shouldn't exceed 60 characters. Also replace Your Site Keywords Here with 10 to 15 keywords that relates your site.

7. Now again Find out (Press Ctrl+F) the below or similar Code

<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>

8. And replace it with below code

<h2 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h2>

Save your template. You are done. It may take 1 week or more to apply. It change must give you more traffic before. You can see show blog post title first on search engine.