Tampilkan postingan dengan label Blogger Basics. Tampilkan semua postingan
Tampilkan postingan dengan label Blogger Basics. Tampilkan semua postingan

How To Change Blogger Default Language and Time Zone

Diposting oleh Unknown



WorldIt's important to choose the right time zone  and language for your blog, so that your posts appear with the correct dates, times and language. Also, if your time zone is incorrect, Blogger may think some posts are dated in the future, in which case they wouldn't be published. Everyone has their own preferences for what they would be using and what they would not. By default, Blogger dashboards come up with the English language. which can be changed easily to any other languages like Spanish, French, Arabic, Urdu, Hindi and etc. Our First Step is changing a time zone and in second step is for changing language.




Change Blogger Default Time Zone


You can change the time zone of your blog by going to the Settings | Language and formatting tab, and changing the setting for Time Zone under the "Formatting" section. Choose the correct option from the list, and click the orange button at the top to save your settings. Like Screenshot below.



Blogger_language_and_time_zone_setting




Change Blogger Default Language


1. Login to your blogger account.

2. After logging into your account follow the steps below



Go to http://www.blogger.com/  where you will notice written English (United Kingdom or United Estate) on the top right corner of your screen just above the list of your blogs. Like Screenshot below



Changing_blogger_default_language



You have successfully changed the default language of the Blogger dashboard. Now you can browse it in your own native language.

Note:- If you have more then one blogs and you want to change just  1 blog language then you can change only 1 blog language by going to language and formatting.. where we change time zone..

We hope this  post helped you on How to change the default language of Blogger. If you faced any problem then kindly do not hesitate to let me know. It would be a pleasure to be at your service. I will write more tutorials in this week so that you may get all the latest updates.

More about → How To Change Blogger Default Language and Time Zone

Target Your Widget or content any where with conditional tags

Diposting oleh Unknown

preview In this post I going to show you how add widget, buttons or anything else only on home page, post page, static page and only Selected post. you can do that with conditional tags. Conditional tags are Blogger template tags that allow you to specify parts of your template to appear only under certain conditions. The Conditional Tags can be used in your Template files to change what content is displayed and how that content is displayed on a particular page depending on what conditions that page matches.
 

Conditional tags syntax

 

Update on 26-5-2013

The Syntax is Like This
<b:if cond='PUT_CONDITION_HERE'> 
</b:if>


Condition is entered as the value of the cond attribute. Each (opening) <b:if> tag need to be closed with a closing </b:if> tag.


 


Below is List of Conditional Tags



Just make sure you include the closing </b:if> tag when applying a conditional in your template.


 


1. Index (list) pages

Index pages include homepage, labels page and yearly archive page.



<b:if cond='data:blog.pageType == "index"'>


2.  Home Page Only


<b:if cond='data:blog.url == data:blog.homepageUrl'>


3. Post (item) Page Only



<b:if cond='data:blog.pageType == "item"'>


4. First Post



This is not a page, but a conditional for the first post.



<b:if cond='data:post.isFirstPost'>


5. Static Page



<b:if cond='data:blog.pageType == "static_page"'>


6. Archive Pages



<b:if cond='data:blog.pageType == "archive"'>


7. Specific Page/URL



<b:if cond='data:blog.url == "PUT_URL_HERE"'>


8. Post and Static Page



<b:if cond='data:blog.url == data:post.url'>


9. Label-Search Pages



<b:if cond='data:blog.searchLabel'>


You can place these conditional tags any where in your template HTML Area. If you have any Trouble post your comments below I will try to make possible..thanks for reading our post.


How to apply Conditional Tags



To apply a conditional tag to a content, simply  put the content between the opening <b:if cond��> and the closing </b:if>, like Below code.



<b:if cond='data:blog.pageType == "item"'>
Here is Your CONTENT
</b:if>


in the example above, the content or widget show only on post pages..  I am writing a few  more examples as soon as time Allow.

More about → Target Your Widget or content any where with conditional tags

How To Add Custom Fonts In Blogger (Video Tutorial)

Diposting oleh Unknown




Custom FontsIn this post I am going to explain you how to add custom font style to blogger blog. Adding Custom Fonts to Blogger can improve the look and feel of your blog.


In your templates you can use any font you want, but these would be properly displayed only if the viewer has those fonts installed on his/her System.


Font embedding Techniques allows you to use any font on your Blog and these fonts will be viewable to the viewers even if they don�t have the font installed on their Systems. Adding custom fonts to WordPress works in the same way. You will add the first piece of code between the head tags in your header file (WordPress does not require that extra slash at the end) and the second piece of code goes into your stylesheet. You can see a list of available Fonts at the Google Font Directory.






How To Add Custom Fonts To Your Blogger Blog







Font Settings


Google font Setting



Make Font Setting which your like.


By Default the Google API provides the Regular version of the Font. If you need specialised versions like  bold, italic or bold and italic,


Now to apply these fonts on your template, you can use these in your template CSS



For example you may use something like
You will have to add a back slash "/" at the end of link and before > Closing.. look like this "/>"



Now you can add custom font style to your blogger


1. First we change our blog Headings font.



1. Go to your blogger Dashboard>> Template>> Proceed>> press CTRL+F and search this code. (how to find code using search bar)



Search The Following Code in your blogger Template CSS Section.





h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:400;
font-family: 'HERE IS YOUR CUSTOM FONT NAME', serif;



Note:- If you cant find code look like this just leave comments.. I will try help you about finding code.



2. and Second we change our blog paragraph font.



Search The Following Code in your blogger Template CSS Section.



body {
background: #FFF;
color: #000;
font-family: "HERE IS YOUR CUSTOM FONT NAME", sans-serif;
font-size: 14px;
line-height: 1.6;
margin: 0 auto;
padding: 0;
}



3. Change Sidebar Widgets Heading Font.



Search The Following Code in your blogger Template CSS Section.



#sidebar h2 {
text-transform: capitalize;
border-bottom: 1px solid #D3D3D3;
color: #404040;
font-family: "HERE IS YOUR CUSTOM FONT NAME",  sans-serif;
font-size: 2em;
line-height: 1;
font-weight: bold;
padding-bottom: 10px;
margin-bottom: 10px; }

4. Change Your blog Header (Blog Name) Font.



Search The Following Code in your blogger Template CSS Section.



#header h1 {
letter-spacing: 0;
margin: 0;
padding: 0;
font-family: "HERE IS YOUR CUSTOM FONT NAME", sans-serif;
font-variant: small-caps;
text-transform: none;
font-weight: bold;
color: #088A4B;
font-size: 70px;
line-height: 1.2;
text-shadow: 3px 3px 3px #aaa;
}



Your Blog Headings. Like H2, H3, H4, as your wish. if you have any trouble about this tutorial leave your comment or questions below in comment box. Thanks for Reading our post.


More about → How To Add Custom Fonts In Blogger (Video Tutorial)

Add Simple contact form with spam protection to your blog

Diposting oleh Unknown


Contact Us Form Builder


In this post I going to show you how to add contact form in your blog. contact forms enable readers to out blog to send us emails without having to knowing our email address to potential spammers. I am using Google docs contact form on my blog but Google docs form have not protection against spamming so decide to add kontactr free form to our blog. recently kontactr added captcha function to their forms which makes more protection against spamming. in kontactr form we also make change in form appearance which suite with our website or blog. in this tutorial I have a better way which can help blogger user about adding contact form and how to customize it. so lets start the tutorial.


Create your Kontactr account which is free of cost.


1. Go to Kontactr Website

Kontactr Signup

2. click on signup now button.

Kontactr Signup form

3. Fill the required fields. YOUR NAME, USERNAME, YOUR VALID EMAIL, PASSWORD and click on sign up button.

4. when you submit your signup request you need validate your free account before using kontactr contact form.

5. Go to your inbox and verify your ownership of kontactr free account.

6. once you verify your account login with your account and get your free contact form.

Note:- you can create only one contact form for each email account.

7. login with your username and password you can see windows like this. click on customize link and customize your contact form.

Contact form customization

8. change colors, Background color, text color, box text color, change these colors with your blogger template color. and get form code below Ajax widget  which I showing above.

and now time to add contact to your blog. go to your blogger dashboard>> pages>> new page and choose black page for text or media.

Steps

Html Area

9. copy the Ajax widget code and paste in blogger html tab. and click on preview if preview is looking good then click on save and enjoy your free contact form.

the details used to submit the contact form will emailed to the address which you used for signup. and kontactr cant save any of your personnel data. and I am very excited with kontactr free simple form offer. thanks for reading our post if you have a any trouble with doing this�.

plz leave your comment and below in comment.

More about → Add Simple contact form with spam protection to your blog

How To Remove Blogger NavBar

Diposting oleh Unknown

NavBarIn This Post I am Going to show you how to remove blogger navigation bar. its very easy and after you remove your blogger navigation bar your blog look professional. Blogger navigation bar is a default feature that appear at the top if your blog hosted on blogger. you can do that by adding a snippet of one code. I have many reasons why should we remove navigation bar, some reasons I am showing you below.

 

 

  • its irritating looking your blog professional.
  • you can b flagged by anyone.
  • its allows you to see other blogs by clicking on next button. which may contain objectionable content like porn explicit content.
  • If you want your blog look like professional website.
  • if Google user logged in with Gmail or Google account but they haven't Administrator right for the blog they are looking at they can see their own Google Account name, A link to their own blogger Dashboard and sign out link.

Update:

In 2012 when Google update blogger interface I have two Method to remove blogger navbar.

Method 1.

1. before any editing in your template make your template backup. ( Here you can see how to make a template backup)

2. go to your blogger template editor (in blogger dashboard) and go Edit Template>>Proceed and press ctrl+f and find these lines.

<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'/>
</b:section>

3. and remove these lines from your template. and click save.Navbar Removing Error

Note: When You Click on Save Blogger Show This type Warning Massage. you must click on Delete Widgets.

That�s it.  save you template and refresh your home page and see result.

Method 2.

1. go to your blogger dashboard>> layout>> and find Navbar Widget and click Edit.

Navbar off

and check rounded box where you see off. and click save button.

if the Navbar turned off, then your blog will show you except that the space where the Navbar was be filled with solid background at the top.

and we have question how to remove this filled background gap.

1. go to your blogger dashboard>>template>>Edit Template ( here you can see how to make a template backup)

and find these lines.

/*Variable definitions

2. Put this code before>> /*Variable definitions.

#navbar { height: 0px; visibility: hidden; display: none;}  

Note:- if we see this problem in method 2 we recommend use method 1 for doing this.

now save your template. and see result.

if you have any questions and leave a comment below in comment Sections. happy blogging!

More about → How To Remove Blogger NavBar

Blogging With Windows live editor

Diposting oleh Unknown


Windows live Editor Preview


In this post I am going to sow you how you can make a attractive  posting with windows live editor. I am at blogger since 2009 and learn about windows live editor in 2011 because I have no too much knowledge about searching blogging and blogger tips etc. but now I am learned about blogging many things. so I decide share these tips with blogger beginner user and which is new on blogger. so lets start learn about windows live editor!




you can make posts offline without login you Google account in browser. with windows live editor you can make your post more professional and add many thing which you can not add with blogger html editor. something like that. Emoticons, can�t resize image, for image only Four options available in blogger html editor, Small, Large, Medium, X Large,you can�t post image in original size, you can�t align image right, left, and wrap image in paragraph, and you can�t add world map in your post, You can not write HTML code just the way it looks in blogger editor because the code is interpreted as a command and blogger editor converts it to how it may look in a browser. But in windows live editor you can resize image any size which you like, and add more css for image by adding image plugins from Microsoft. I am showing you in video below how to add plugins in windows live editor.




If you are living in Pakistan. these days You Tube is Blocked in Pakistan so you can�t see video Player Below. If you want unblock You Tube For Watching this Video tutorial. check out This Link for unblock You Tube.


Video Tutorial For Adding Plugin















Windows Live Editor Screen Shoot:-



Click on Image For View Original Size


you can make your image tilt and add polaroid effect in your image. and make album rotating style with any angle. so without wait go to link below and download windows live editor and make your posts like professionals.





For This Software you need install some updates from Microsoft  for updates Download these installers,  Download and enjoy Professional blogging posting with windows live editor. thanks for this subscribe me via email and get updates in you inbox. happy blogging!


I you have any problem or missing anything else leave your comments below in comment section.


More about → Blogging With Windows live editor

Two Color Code Generator Tools

Diposting oleh Unknown





In This Post I Going To Share and Two Color Generator Tools with you. This tool will help your get the six digit Color Code and hexadecimal Value. and after getting the color you can make your blogger post more spicy and Color full.
Read the Methon below Before Use the tools.



Colour Code Generator Tool 1


Method Instructions:




  1. First drag the bar on the hue color selector to the area of your choice color Palate.



  2. Then Click Inside The Brightness-saturation area move the cursor until you have found the your desired Color. The swatch bar which you can top right on the color tool show you the final Color Result.



  3. The Hexadecimal Color COde is Generated in the Hex tab. Simply Copy the color code and use in your post.


  4. That's it!










Color Chart Wheel For Finding Matching Colors Palate





This is a very useful and very easy to use for finding color code.

Method Instructions:


  1. Simply paste your color without (#) in form which available above (update button) and then click on update button.


  2. The Four Matching color will appear in four boxes which you can see right side the wheel.


  3. you can copy you choice color code and use in your post or anywhere.











All Credits For these color tools goes to 2createawesite

More about → Two Color Code Generator Tools

How To Make a Template Backup in Blogger and How to Edit Blogger Template

Diposting oleh Unknown



In Our tutorials we make more changes in your blog and websites so we must need our blog or website template backup. when you edit your template first time I think if Make a little mistake then the backup of your template which save in your hardDrive this is helping you revert back your blogger tamplate.



in this video I am going to show you how to make a backup of your template and how to edit your template in blogger. this is my first video tutorial if have any mistake ignore it. lets start the tutorial. This Video Hosted on Youtube if you viewing my from pakistan in these youtube is blocked in pakistan if you want ublock youtube check out this post





More about → How To Make a Template Backup in Blogger and How to Edit Blogger Template

how to find code in blogger with search bar

Diposting oleh Unknown

Find code

In this post we learn how can you find code in blogger template. Many users have a in mind find this, find this code, but how can I find a code in template which thousands codes. so in this post we learn about this.

So to help I always ask you Press ctrl+f and search this code or below code. so here I going to show how to find code with browser search bar. you have followed the tutorial steps and you have reached the html template page I showing below.

 

 

Html Template code

Now you have to find a piece of code in your Blogs Html, showing below.

</body>

easy 2 steps for finding </body>.

1. Press CTRL+F From Your keyboard.  like a below screen shoot.

Keyboard

When you click on the CTRL+F Search bar will on the top of your browser. and if you are using Firefox search bar appear in bottom. in chrome like this.

CTRL F

and now write in the search bar </body> and press enter. after press enter you can see window like this.

Find Body Tag

you can also click on arrow buttons for the next or previous code which you can see on search bar right side.

may be in your browser search bar look different but its work is same don't worry. thanks for reading my post. check my post about how to edit blogger template and how to make a backup your template.

If you have a any question leave your comments below in comment section.

More about → how to find code in blogger with search bar