Sunday, 20 April 2014

How to Display Author Name in Blogger Posts

Author name is one of the best ways to give some acknowledgment to the article publisher. Most of the quality template developers like Templateism and Themeforest always includes author names in their themes by default. Recently, one of our readers wrote an email asking about how to display author name in blogger posts, so it could help users to know that who actually wrote this post. In this article, we will show you how to display author name in Blogger posts.

Blogger.com collects the data of the author from your blogger profile in case you haven’t connected your Google+ account with Blogger. If you haven’t connected your profile then you can change the name of your blogger account. Whenever that author will publish a post, this display name will appear as the name of the author.

The very first thing you need to do is to login into your Blogger account, after logging in go to Template >> Edit HTML. Now in the blogger template editor search for<data:post.body/> tag and just above it paste the following piece of coding. If you want to display the author name at the end of your post content then, paste the code below <data:post.body/> tag.

<span class='author_mbl'>By: <a expr:href='data:post.authorProfileUrl'> <data:post.author/></a> </span>

To give a bit of styling you can simply paste the following CSS coding in the style sheet (Quick tip: Paste it just above ]]></b:skin> tag). You can customize it according to the nature of your template, following is the very basis CSS coding.

.author_mbl a { text-decoration:none;}
.author_mbl a:hover {text-decoration:underline;}
.author_mbl { float:left; color:#555;}

Congratulations: Now save your template by pressing the orange “Save Button” present at the very top of your screen. Excellent, now go and check your site the results. If you have followed our step correctly, then the author names of your posts would appear just fine.

We hope this post has helped you in learning how to display author name in Blogger Posts. Though, this technique is extremely simple, but few folks find it difficult to understand. This post might also help template developers who want to automate the author names in their templates. Do let us know what are your thought about this technique, if you are already using it this piece of code then share your quality opinions with us.

EDUCATOR TEMPLATE DOWNLOAD

Educator Blogger Template

Educator Blogger Template is utterly stylish yet decent and sober theme designed for BlogSpot based websites. We have designed this template for all those colleges, universities

Live Preview

CLICK HERE TO DOWNLOAD THIS TEMPLATE

Educator Blogger Template is utterly stylish yet decent and sober theme designed for BlogSpot based websites. We have designed this template for all those colleges, universities and other institutions who want to have an amazingly professional website with not a lot of expenses. Educator Blogger template allows you an ideal online institution website, and at the same time it can also be converted in a full-time magazine blog. Though, it is designed for educational blogs, but one can also use it on magazine, Technology, Multimedia based websites.

Features of Educator Blogger Template:

Responsive Blogger Template: This theme supports multiple dimensions, which means it would appear just perfect on your personal computers, laptops, smartphones, and the rest of the other devices. Which means your mobile users would enjoy browsing your site as it would bring a lot of perks to them.

Full Width Image Slider: In this theme, we have also connected a responsive highly flexible image slider. You can upload picture of any sizes, and it would stretch it just faultlessly. However, to bring productive results upload a decent large image.

Featured Posts: Like our other templates, we have also included featured post functionality through which you can display posts tagged with a specific Label differently. To install this function, check out the details below.

SEO Optimized: Search engine optimization is considered as the one of the essential element of a website this is the reason why we always emphasis on developing themes having moderate SEO score. We have added some distinct on-page SEO plugins which would certainly help you in increasing your Google SERP Rankings.

More Features: Multiple Drop Down Menu, 4 columns Footer, 3 columns Template, Threaded commenting system, related posts, Ads ready, SEO Friendly and much more.

How to Customize Feature Top Label:

To customize Feature top Label first upload this template to your site then go toBlogger.com >> Layout >> Feature Top (Full Width) >> Edit and paste the following code in the HTML Text box. Note: Replace "Technology" with your Label. Remember: The spelling should be accurate otherwise it would not work, even take care of upper and lower class letters.

<h2 class="featuredi"><a>Feature Update<a></a></a></h2>

<script src='/feeds/posts/summary/-/Technology?max-results=4&orderby=published&alt=json-in-script&callback=recentthumbs&' type='text/javascript'/>

</div> <div class='clears'/></script>

How to Customize Feature Top Label:

To customize Feature Left Label go to Blogger.com >> Layout >> Feature (Side) >> Edit and paste the following code in the HTML Text box. Note: Replace "Tech" with your Label. Remember: The spelling should be accurate otherwise it would not work, even take care of upper and lower class letters.

<div id='featureside'>

<h2 class='featureside'><a>Feature Update<a/></a></a></h2>

<script src='/feeds/posts/summary/-/Tech?max-results=8&orderby=published&alt=json-in-script&callback=recentthumbs&' type='text/javascript'/>

</div> <div class='clears'/>

How To Customize Slider:

First login to your blogger dashboard and go to Template >> Edit HTML and search for the following piece of code and customize it according to your desire needs.

<section class='slider-wrapper'>

We hope this Blogger theme would help you in renovating your blog with true awesomeness. The speed of this theme is quite fast despite of the fact that we have use a lot of JavaScripts. Let us know what do you think about it.

Add Twitter Follow and Facebook like Button Below every blog Post in Blogger/BlogSpot

This tutorial I will show you how to Add Twitter Follow and Facebook like Button Below every blog Post in Blogger/BlogSpot. It will increase your blog's Facebook likes and twitter Followers and you will get moreFollowers and likes. It is Very easy to install in your Blog. This Plugins is made Compatible to work with all browsers especially with IE8. Today i am giving the Code and How to add the Social Subscription Widget to your Blogger/BlogSpot Blog. Let's start adding this Plugins :)

How to Install This Plugins in your Blogger/BlogSpot Blog?

The steps are made really simple. Follow these,

Go to Blogger Dashboard --> Design --> Edit HTML
Backup your Template before making any changes to your blog
Now Expand Widget Templates
Find the code shown below using [ctrl+F]

<data:post.body/>

<div class='post-footer-line post-footer-line-1'>

Now Paste the Code shown below just before/above it

<div style="margin:5px 0px 10px 0px; padding:10px; width:590px;float:none; ">
<div style="float:left; width:272px; border-right:1px solid #ddd;">
<iframe allowtransparency="true" src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Furdu2uts&width=292&colorscheme=light&show_faces=false&border_color&stream=false&header=false&height=62" style="border:none; overflow:hidden; width:292px; height:62px;" frameborder="0" scrolling="no"></iframe>
</div>
<div style="margin:15px 15px 0px 0px; padding:0px; float:right; width:260px;">
<iframe title="Twitter Follow Button" style="width: 266px; height: 32px;" class="twitter-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_&id=twitter-widget-0&lang=en&screen_name=urdu2utorail&show_count=true&show_screen_name=true&size=l" allowtransparency="true" frameborder="0" scrolling="no"></iframe>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
</div> </div>

Save the widget and you are done!

Now make these changes,

Replace urdu2uts with your Facebook username and urdu 2uts with your twitter username

Finally save your template and Visit your blogs to see it working just perfectly. If still you are getting any single problem then feel free to mention it via comments, I will reply as soon as possible.

Saturday, 19 April 2014

HOW TO change mouse cursor

IN THIS VIDEO TUTORIAL urdu2ut have tell you about
how to change mouse cursor of a pc so it is a simple
video tutorial that urdu2uts have shared with you
about site my site is collection of tuts like=download
template set widgets on blogger watch video tutorial
THANK YOU

HERE IS TUTORIAL

HOW TO change mouse cursor by ahsanqayoom24

DOWNLOAD CURSOR PACK OF WINDOWS 7

Awesome Mag

Awesome Mag Blogger Template is fully responsive theme that comes with features that are never seen before in a BlogSpot blogger template.

Live Preview

CLICK HERE TO DOWNLOAD THIS TEMPLATE

Awesome Mag Blogger Template is fully responsive theme that comes with features that are never seen before in a BlogSpot blogger template. It has a unique fluid design concept with robust elements, which make it a complete package of theme that could be converted into any niche site or blog. It is a 3 column template that can be customized into a portfolio, magazine, personal blog, products, list based sites and etc. It is optimized for both on-page and off-page SEO that gives enough flexibility to rank your post higher in the search engine results, and allows to index your posts 99% faster than the rest of the Blogger templates available on the internet.

Features of Awesome Mag Blogger Template:

100% Pure Responsive: Honestly speaking this is the only 100% responsive blogger template available on the internet. Though, we have published more than 10 Responsive templates, but this is certainly the best out of them all. It supports all devices like iPad, iPhone, Android, Desktop, and Laptop.

Mega Drop Down Menu: A Mashable inspired mega drop down menu is something that every blogger adores to have in his template. It is responsive and extremely flexible to use.

Featured Label Area: It further allows to add Feature posts in the right sidebar of your template allowing more engagement to your featured posts. It is easily customizable and works on jQuery, so it is amazingly fast and reliable to use.

Random Articles Button: This is a handy tool that takes users to a random article every time they "Hit the button". It is useful for those who are running List based sites or write random content.

More Features: 4 columns Footer, Elegant color scheme, Professional design, Tabbed sidebar widget, Ads-Ready and much more.

Template Customization Instructions:

How to Customize Feature Top Label:

To modify EDITOR'S CHOICE, go to Blogger.com >> Layout >> Right Sidebar >> Edit, and paste the following code in the HTML Text box. Note: Replace "Featured" with your Label. Remember: The spelling should be accurate otherwise it would not work, even take care of upper and lower class letters.

<script type='text/javascript'>
var numposts = 10;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = true;
var showpostsummary = false;
var numchars = 280;
</script>
<script type="text/javascript" src="/feeds/posts/default/-/Featured?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

How to Display Recent Posts?

Go to Blogger >> Layout >> Recent Posts >> Edit >> Paste the following code in the HTML Box and save the template.

<div class="recent_posts">
<script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
<script type="text/javascript" src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=labelthumbs"></script>
</div>

This theme is highly fast and professionally responsive. It is a pure combination of quality and things that are amazingly beautiful and incorporated first time ever in blogger. Share your thoughts by giving your precious opinions below.

how to unblock youtube in pakistan

unblock youtube in pakistan

urdu video tutorials. Complete method to how to unblock youtube in pakistan urdu video tutorials we are going to tell. So many web sites on the Internet. how to unblock youtube in pakistan urdu video tutorials provided. urdu2uts decided. We the people how to unblock youtube in pakistan urdu video tutorials provided. While you follow the people. udu2uts At this video training in addition to how to unblock youtube in pakistan urdu video tutorials. URDU2UTS & ahsan qayoom will remember in your prayers. thank you All Friends...

HOW TO UNBLOCK YOUTUBE WITHOUT ANY SOFTwares by ahsanqayoom24

Tow stylish search forms/boxes widgets for blogger

In this post I will show you how to add two stylish search forms to your blogger blog. This search form widget is very easy to implement your blogger blog. So you can easily add this to your blog. One of these search form is orange and other one is blue color. Now starting following my post see our Screenshot bellow.

How to add these search boxes to blogger blog?

I presented this tutorial with five simple steps so, carefully follow these simple steps bellow to add these search form.

1. Go to Blogger dashboard>Layout>

2. Now add a Html/JavaScript gadget

3. Copy any one code's showing bellow of two designs

4. Save the gadget.

Search Box Code Blue

<style>
#iseosearch{
border: 1px solid #DDD;
box-sizing: border-box;
color: black;
font-family: 'Lora', serif;
font-size: 14px;
padding:9px;
width: 180px;
}
.s {
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
}
.s:hover {
box-shadow:inset 1px 1px 8px gainsboro;
}
.s:focus {
background-image: -webkit-linear-gradient(white,white); background-image: -moz-linear-gradient(white,white); background-image: -ms-linear-gradient(white,white);
background-image: -o-linear-gradient(white,white);
background-color:white; outline:1px solid rgb(0, 152, 253); color:black; font-style:normal; box-shadow:inset 1px 1px 8px gainsboro; border:1px solid rgb(0, 152, 253);
}
.searchsubmit{
background:#00A7ED;
border: 1px solid #0094D2;
color: white;
cursor: pointer;
font-family: 'Droid Sans', sans-serif !important;
color: #fff;
cursor: pointer;
line-height: 19px;
padding: 8px 10px;
text-decoration: none;
}
.searchsubmit:hover{
background:#0094D2;
}
</style>
<div id='search-box'>
<form class="searchform" action="/search">
        <input id="iseosearch" class="s" name="q" x-webkit-speech="true" onblur="if (this.value == "") {this.value = "Search This Website ...";}" onfocus="if (this.value == "Search This Website ...") {this.value = ""}" value="Search This Website ..." type="text">
        <input value="Search" class="searchsubmit" type="submit">
    </form>
</div>

Search Box Code Orange

<style>
#iseosearch {
    border: 1px solid rgb(221, 221, 221);
    background-color: whiteSmoke;
    color: black;
    font-family: 'Lora',serif;
    font-size: 14px;
    padding: 9px;
    width: 180px;
}
.searchsubmit:hover {
    background: url("http://4.bp.blogspot.com/-taDC-lU0_tY/UNPf1cwXFBI/AAAAAAAAHvA/64FgVp9E0Zk/s1600/gradient.png") repeat scroll 0px -33px transparent;
    text-decoration: none;
}
.s:focus {
background-image: -webkit-linear-gradient(white,white); background-image: -moz-linear-gradient(white,white); background-image: -ms-linear-gradient(white,white);
background-image: -o-linear-gradient(white,white);
background-color:white; outline:1px solid rgb(0, 152, 253); color:black; font-style:normal; box-shadow:inset 1px 1px 8px gainsboro; border:1px solid rgb(0, 152, 253);
}
.searchsubmit {
    background: url("http://4.bp.blogspot.com/-taDC-lU0_tY/UNPf1cwXFBI/AAAAAAAAHvA/64FgVp9E0Zk/s1600/gradient.png") repeat scroll 0px 0px transparent;
    border: 1px solid rgb(237, 112, 43);
    color: rgb(255, 255, 255);
    cursor: pointer;
    line-height: 19px;
    padding: 8px 10px;
    text-decoration: none;
}
</style>
<form class="searchform" action="/search">
        <input class="s" name="q" id="iseosearch" x-webkit-speech="true" onblur="if (this.value == "") {this.value = "Search This Website ...";}" onfocus="if (this.value == "Search This Website ...") {this.value = ""}" value="Search This Website ..." type="text">
        <input value="Search" class="searchsubmit" type="submit">
    </form>

You are done.

If you have any question, fell free to ask by the comment form. Thanks for reading this post.

New Numbering/numbered page navigation widget for blogger

This is my first post about numbering page navigation for blogger/BlogSpot. So you can follow my first post to add page navigation widget in your blogger blog. We recommend you to follow this post, because this post is very easy to implement your blog more then our older post. Also am using the stylish numbered page navigation widget for my blog.

How to add this page navigation widget to your blogger blog?

I showing this post with two simple steps, first one is adding css and second one is adding JavaScript. So follow those steps carefully to add this widget.

Adding the CSS Cods:

Go to Blogger Dashboard >> Template >> Edit HTML.
Find ]]></b:skin> tag in your blogger template HTML editor
And then copy the below code and paste before the ]]></b:skin>

.showpagePoint {
    text-decoration: none;
    background: linear-gradient(to bottom, rgb(242, 242, 242) 0%, rgb(229, 229, 229) 100%) repeat scroll 0% 0% transparent;
    color: rgb(41, 41, 41);
    border: 1px solid rgb(227, 227, 227);
    display: inline-block;
    margin-right: 3px;
    padding: 7px 10px;
    font-weight: bold;
}
.showpageOf {
    color: rgb(255, 255, 255);
    font-weight: bold;
    background: none repeat scroll 0% 0% rgb(224, 102, 102);
    padding: 8px;
    margin: 8px;
}
.showpageNum a:hover {
color: white;
}
.showpageNum a:link {
    background: linear-gradient(to bottom, rgb(255, 255, 255) 0%, rgb(242, 242, 242) 100%) repeat scroll 0% 0% transparent;
    color: rgb(51, 51, 51);
    margin-right: 3px;
    display: inline-block;
    padding: 7px 10px;
    border: 1px solid rgb(227, 227, 227);
}
.showpageNum a:hover {
    text-decoration: none;
    background: linear-gradient(to bottom, rgb(242, 242, 242) 0%, rgb(229, 229, 229) 100%) repeat scroll 0% 0% transparent;
    color: rgb(41, 41, 41);
    border: 1px solid rgb(227, 227, 227);
    display: inline-block;
    margin-right: 3px;
    padding: 7px 10px;
}

Now save your template.

Adding the JavaScript Cods:

This is the second and last step. Now you wont to add JavaScript codes in your template.

Again Go to Blogger Dashboard >> Template >> Edit HTML.
Now find </body> tag in your blogger template HTML editor
and then Add below code just above </body> tag

    <script type='text/javascript'>
      var postperpage=5;
      var numshowpage=5;
      var upPageWord ='<<';
      var downPageWord ='>>';
      var urlactivepage=location.href;
      var home_page="/";
    </script>
<script type="text/javascript" src="http://yourjavascript.com/3215021430/www-mybloggerblog-coml.js"></script>

Finally Save your template and you’re done! :)

Now enjoy a new experience with number page navigation.

ABOUT MY SITE

"www.urdu2uts.blogspot.com" Online video tuts" A video Web Site which provides free Advancd video tutorials in Urdu language All about Making Money Online, SEO, Web Designing, Google Adsense. Video Editing , blogging Tips And Tricks , And Much More. First of all we want to to thank you very much. You are worthy of our website. My name is AHSAN QAYOOM. And I for you people. Many of the best online this site will complete video course on topics. And full with the fresh content videos will attend the course in Urdu language. And I hope. Of the course you people will find that every videos. You needs of people feels. Online urdu2uts complete videos course you will get a thousand. All courses in life who to everyone will come a lot of work. And I hope. Our would be nice than quality of people of every course. And you guys can expect. Your Ustaad video online computer learning courses will become the skills. And then you will be able to earn real money from internet easily. And you guys will be able easily create your own blog and website. Send online urdu2uts is for you fellas. Your online urdu 2uts more than a thousand people are going to provide a free video course. We price your video course you do not ask. Yeah, you guys look good online urdu2uts website. If the site online urdu 2uts let everyone share. Online urdu2uts if you you want to compensation the hard work of. Only one thing, we all pray Remember the your. And everyone Share online video 2uts. And online computer worthy Thank you to Ustaad's Facebook page. And if you guys online urdu2uts latest updates in your email inbox to receive. If online urdu2uts news of updates box on the sidebar. Of putting your email address in the box to subcribe. Thank you

Top

URDU VIDEO TUTORIALS

Sunday, 20 April 2014

How to Display Author Name in Blogger Posts

EDUCATOR TEMPLATE DOWNLOAD

Educator Blogger Template

Features of Educator Blogger Template:

How to Customize Feature Top Label:

How to Customize Feature Top Label:

How to Customize Feature Top Label:

How To Customize Slider:

Add Twitter Follow and Facebook like Button Below every blog Post in Blogger/BlogSpot

How to Install This Plugins in your Blogger/BlogSpot Blog?

Saturday, 19 April 2014

HOW TO change mouse cursor

Awesome Mag

Features of Awesome Mag Blogger Template:

Template Customization Instructions:

How to Customize Feature Top Label:

How to Display Recent Posts?

how to unblock youtube in pakistan

Tow stylish search forms/boxes widgets for blogger

How to add these search boxes to blogger blog?

New Numbering/numbered page navigation widget for blogger

How to add this page navigation widget to your blogger blog?

Adding the CSS Cods:

Adding the JavaScript Cods:

ABOUT MY SITE

Followers

Recent Posts

Follow The Author