SUNGSAH: Blog

Showing posts with label Blog. Show all posts

How to Change your Gmail Theme Background Image

(Like ) ေပးပါ

New ! How To Add Post/Page Views Counter to Blogger

As you know, Blogger not support display page and post views. Just Follow the steps -

CLICK TO VIEW DEMO

Now, click Save template and go to add the widget.

Note: if you want to reinstall or update widget, please remove the old one before add a new one. ]

Installation

Read More ->>

How To Hide / Remove The Blogger Official Navigation Bar

ဒီ ပုိ႔(စ္) ေလးကေတာ့ ဘေလာ့ဆုိဒ္ အေပၚက NavBar ျဖဳတ္နည္းေလးပါ။ ဘေလာ့ဆုိဒ္ ျမင္ကြင္းကုိ လွလွပပ ျမင္ေစခ်င္တဲ့သူေတြကေတာ့ ဒီ Official Navigation Bar ကုိ ျဖဳတ္ၾကပါတယ္။ မျဖဳတ္လည္း ဘာျပႆနာမွမျဖစ္ပါဘူး။ ျဖဳတ္ရင္ေတာ့ ဘေလာ့ဆုိဒ္ျမင္ကြင္းပုိသန္႔ၿပီးလွတာေပါ့ေနာ္။

၁။Sign In Blogger

၂။ Template

၃။ Edit HTMl

၄။ Proceed

၅။ ေအာက္က Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။

view plainprint?

]]></b:skin>

ေတြ႔ၿပီးဆုိရင္ ]]></b:skin> ရဲ႕အေပၚမွာ ေအာက္က Cond ေလးကုိ ထပ္ထည့္ေပးလုိက္ပါ။

view plainprint?

#navbar-iframe {display: none !important;}

ထည့္ၿပီးရင္ Save Template ကုိ နုိပ္လုိက္ပါ။ ၿပီးရင္ မိမိဘေလာ့ဆုိဒ္ ကုိဖြင့္ၾကည့္ပါ။

Read More ->>

Blogger Trick: How To Post HTML Codes

If you have a blog theme tutorial learn about blogs, you definitely have to post someHTML Codes. For Beginner Blogger, may get a little error when publishing the post. Because the post to include some of the HTML code does not write like a normal way. So to enter HTML code in the Post, we have to change some of the code. Here I will explain to you some code that should be changed.

Before we start, please understand these codes with the descriptions in the list below.

Before (Original)	After (Changed)	Description
<	<	Marks the beginning of code lines
>	>	Marks the end of the cover code
&	&	Mark of "and"
"	"	Mark of double quotes
±	±	Mark of plus minus
Space		Mark of space
©	©	Mark of copyright
®	®	Mark of Registered

For example:

This is your original code that you wanna post:

Blogger Trick Blog

To post, you must change the code to be like this:

<br/><br/>

<code>

<a href="http://bloggertrick4u.blogspot.com/" target="_blank">Blogger Trick Blog</a>

</code>

This tag <code> and </code> is for show your HTML code on your post. But don't forget to change the code as the table above. How? Do you understand? If you do not understand about this post, please leave your comment or question under this page. Good luck.

Read More ->>

How To And Where To Upload .swf Files ?

How To Upload SWF Object

First go to Google Sites.
Sign In/Sign Up to your account.
Click On Sidebar.

Click on Attachments Tab and hit the Upload the button.

Upload your file.

After uploading successfully you will see View And Download links just right click on download link and select the copy link address.

Now you have the link for your uploaded SWF File.

UPDATE - Your Uploaded SWF File Link will look like this :

https://sites.google.com/site/yoursite/24049.swf?attredirects=0&d=1

Remove the text after ? sign.

Now your link will look like this

https://sites.google.com/site/yoursite/24049.swf

Now copy the link and you are done...

What Next?

In next post I will provide embed code generator so that you can easily use your flash file in your blog.Just wait and watch....

I hope you will surely like this tutorial.If you think that this post is helpful then don't forgot to share it with your friends.Thanks... :) Have a nice day...

Read More ->>

Use Automatic Read More Jump Break With Thumbnail On Blogger

On Blogger you have the option to add a jump break to your posts, so the posts will be displayed with just a short summery on the home page and a link to read the full post will be below.The jump break has a number of great advantages, if you display full posts on your home page it will severely slow down the load time, Also With the jump break in place visitors that land on your home page will see a selection of your posts without the need to scroll.It's also more professional looking and as visitors have to click through to the full post it increases page views.

In this Blogger Tip i have a script that will automatically turn your posts into read more summary's on your blogs home page with a few added extras.Here are some of the features of an auto Read More along with a live demo :

- Your posts will automatically be displayed as short summary's with a read more link.
- An image from the post will be re sized into a thumbnail and displayed beside the summery.
- You can choose how much text is displayed in the summery.
- You can choose the size of the thumbnail.
- All Previous posts will also have the jump break so you don't need to go through your archive adding it.

Live Demo - I have added the code to a test blog using the Simple Template from the Blogger template designer and you can see it here - Auto Read More Demo.

The script is used on Most Magazine Templates i publish on my Blogger Templates Site so i thought why not make it available on all blogs ? As well as posts having the jump break on your home page it will also be used on your label pages and archive pages.

Update 07 June 2011 - I have improved this code so your static pages will display properly.With other versions of this code your static pages will have the read more added but will not open when clicked.Now your pages will display fully without the read more jump break.Update helped with thanks to Harish from Way2Blogging.

If you added the old code you will need to replace it with the updated code.To see exactly what you need to replace you can see the old code here with instructions.

Add Auto Read More Post Summary's To Your Blog

Step 1. In Your (New Design) Blogger Dashboard Click The Drop Down Menu For Your Blog > Choose Template > Then Edit Html > Now Proceed > Tick The Expand Widget Templates Box as shown in the video Below :

Step 2. Find the following piece of code in your blogs Html : (Click CTRL and F for a search bar to help find the code - More Info)

</head>

Step 3. Copy the following code and paste it Directly Above / Before </head>

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;

summary_img = 340;

img_thumb_height = 120;

img_thumb_width = 120;
</script>
<script type='text/javascript' src='http://bloggerblogwidgets.googlecode.com/files/auto_readmore_blogger.js' ></script>

Important

The code in red sets how the post summary's are displayed.Remember if a post has an image it will be re sized into a thumbnail to be displayed beside the summery.If the post does not have an image just a text summery will be displayed.

summary_ noimg= 430; --> The length of the summery if the post does not have a thumbnail.
summary_img = 340; --> The length of the summery if there is an image in the post that will be converted into a thumbnail.
null_thumb_height = 120; --> The height in pixels of the thumbnail.
null_thumb_width = 120; --> The width in pixels of the thumbnail.

Step 4. Find the following piece of code in your blogs Html : (Click CTRL and F for a search bar to help find the code - More Info)

<data:post.body/>

Step 5. Replace <data:post.body/> With The Code Below

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if>
</b:if>

Note - You can change the text in red from Read More to "Continue Reading", "Read Full Post" or anything you like.

Note 1. You should try to have the first image in your posts as close to square as possible so they work well when used as thumbnails on your home page.Images that are for example rectangle in shape will appear distorted when they are re sized.I use a version of this script on this blog and always add an image at the top of the posts that are close to square, then size then wont make a big impact on the appearance.Remember it's the first image in each post that is used as a thumbnail.

Step 6. Save Your Template.

That's it for this Blogger tip, All your posts including all archived posts will now be displayed with a summary and read more on your home page, labels pages and archive pages.Check out more of our Blogger Tips and Blog Gadgets.

Did you know you can use a Jump Break In Your Full Feed ?

Drop Your Comments, Views And Opinions Below.

Read More ->>

How to Reset Your Blog

If you are having problems with blogger, and things aren't working quite right. You may be able to fix the problem by resetting your blog.

By resetting your blog will not lose you any posts you made.

How to Reset Your Blog

The first thing you need to look at is the current layout of your blog, it will be either one which you have a template tab or one on which you have a layout tab.

Template Tab Blog

If you have a blog that when you go into your dashboard and blog you see the tabs and links shown above, the posting, setting and template links. To reset your blog you do the following

1. Click on the Template link from your dashboard or Template tab from your blog.

2. Click on the Customise Design tab

3. Click on the Upgrade Your Template button in the middle of the screen

4. Select a new template from the templates on screen and click on the save template button

Your blog will now change to show you page elements and give you tabs for posting, settings and layout.

Your blog is now reset and you can continue posting as normal.

Layout Tab Blog

If you have a blog that has a posting, settings and layout links on the dashboard or tabs on your blog like those aboe. To reset your blog you do the following.

1. Click on the layout link from the dashboard or tab in your blog

2. Click on the Edit HTML tab

3. Near the bottom of the screen, under the box with the HTML code in it you will see a link that says Revert to Classic Template, click it.

4. You will get a popup appear, click OK

You will now see that the you have a template tab in place of the layout tab, this means you have successfully reset your blog

Your blog is now reset and you can continue posting as normal.

Read More ->>

How To Change Older Post And Newer Post Link

Someone had asked Kang Rohman about how to hide Older Post or Newer Post in blogger, and Kang Rohman had answered the question by posting an article titled “Hiding Older Post and Newer Post Link”. The other question that relates with “Older Post and Newer Post” is asked again, the question as follow:

Hello,

I am wondering if you can change the words “newer” and “older” to the next and previous post’s titles-I have a screenshot of a blog that has this if you email me I can send it.

Thanks

Is this your question? OK, Kang Rohman will try to answer. The word Older Post or Newer Post can certainly be changed as you want, for example, changed with “Next” or “Previous”, even the words not only can be changed with other words but also can be changed with images or icons. Let’s examine one by one.

Changing Older Post and Newer Post with Next and Previous

Follow the steps below:

Log in to blogger with your ID
Click Layout
Click Edit HTML tab
Click “Download Full Template”, please back up first your template (important)
Please check the small box beside Expand Widget Template
Wait for a while until the process finished
Find the following code on your template:

<span id='blog-pager-newer-link'>
     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
     </span>
   </b:if>

   <b:if cond='data:olderPageUrl'>
     <span id='blog-pager-older-link'>
     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
     </span>
   </b:if>

   <b:if cond='data:blog.homepageUrl != data:blog.url'>
     <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
     <b:else/>
     <b:if cond='data:newerPageUrl'>
       <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
     </b:if>
   </b:if>
Look at the code in red printed.
Change the code <data:newerPageTitle/> with the word Next and the code <data:olderPageTitle/> with the word Previous
Click Save Template button
Finished

It’s simple, right?

Changing Older Post and Newer Post with Icon

To change Older Post and Newer Post with icon, the first step is preparing the icon which you want to use. For example Kang Rohman has the icons like this:

Please upload the icons you have to a server that you usually use to place an image, and note the URL address. For example Kang Rohman has the icons’ URL address as follow:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaiyMCVV79YVW5U_c3i15jljE_KSNSD0nwwpTl-bOC6MxYiytKGFKBgoj9eLC0afxCjGL8ytp8dchsF5JQ9QpRASOEAHRbriNYHiqgkVQB0PLz43IACZVo3PckSsQRNzNzNqjZH8AdRGU/?imgmax=800

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiImNtByTRt5pJTm6_jdq1YbCa5DvKf_jGWLfCYdwVq040ahI73XWLtebId6QvPMNfohEWUeHiWyZN4y_HLI33glZwWxfPZvHlBIzCVfZj0Bnc3ybjVTSXcCuk0TaGA9FwggcHUOwj4r-g/?imgmax=800

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTcirCNlo-7XVAlAAt5l1RDfv9uUkIlbtSFYsfsFKtcERjlJX0Yb3CwuJzMJ0q6S7YKZY0S6tAZ4vojtt0UENfp91Ngn_12iE5Fic21aSS1Urc6R1TGV5XkS1Yac-kjHjlGmplWLAOBYo/?imgmax=800

Change the above code into like this:

If you have had the code as above, the next step is to place it on your template code, here are the ways:

Log in to blogger with your ID
Click Layout
Click Edit HTML tab
Click “Download Full Template”, please back up your template first (important)
Please check the small box beside Expand Widget Templates
Wait for while until the process finished
Find this code on your template:

<span id='blog-pager-newer-link'>
     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
     </span>
   </b:if>

   <b:if cond='data:olderPageUrl'>
     <span id='blog-pager-older-link'>
     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
     </span>
   </b:if>

   <b:if cond='data:blog.homepageUrl != data:blog.url'>
     <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
     <b:else/>
     <b:if cond='data:newerPageUrl'>
       <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
     </b:if>
   </b:if>
Look at the code in red printed
Change the code <data:newerPageTitle/>, <data:olderPageTitle/>, and <data:homeMsg/> with your icon code. E.g.

<span id='blog-pager-newer-link'>
     <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><img alt='Next' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaiyMCVV79YVW5U_c3i15jljE_KSNSD0nwwpTl-bOC6MxYiytKGFKBgoj9eLC0afxCjGL8ytp8dchsF5JQ9QpRASOEAHRbriNYHiqgkVQB0PLz43IACZVo3PckSsQRNzNzNqjZH8AdRGU/?imgmax=800' title='Next'/></a>
     </span>
   </b:if>

   <b:if cond='data:olderPageUrl'>
     <span id='blog-pager-older-link'>
     <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><img alt='previous' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiImNtByTRt5pJTm6_jdq1YbCa5DvKf_jGWLfCYdwVq040ahI73XWLtebId6QvPMNfohEWUeHiWyZN4y_HLI33glZwWxfPZvHlBIzCVfZj0Bnc3ybjVTSXcCuk0TaGA9FwggcHUOwj4r-g/?imgmax=800' title='previous'/></a>
     </span>
   </b:if>

   <b:if cond='data:blog.homepageUrl != data:blog.url'>
     <a class='home-link' expr:href='data:blog.homepageUrl'><img alt='home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTcirCNlo-7XVAlAAt5l1RDfv9uUkIlbtSFYsfsFKtcERjlJX0Yb3CwuJzMJ0q6S7YKZY0S6tAZ4vojtt0UENfp91Ngn_12iE5Fic21aSS1Urc6R1TGV5XkS1Yac-kjHjlGmplWLAOBYo/?imgmax=800' title='home'/></a>
     <b:else/>
     <b:if cond='data:newerPageUrl'>
       <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
     </b:if>
   </b:if>
Click Save Template button
Finished

The example of the result will be like this:

If you get error messages when editing the template, please try using a different browser

Good luck!

Read More ->>

SUNGSAH

How to Change your Gmail Theme Background Image

(Like ) ေပးပါ

New ! How To Add Post/Page Views Counter to Blogger

Note: if you want to reinstall or update widget, please remove the old one before add a new one. ]

Installation

How To Hide / Remove The Blogger Official Navigation Bar

Recent Posts By Label Gadget For Blogger

Blogger Trick: How To Post HTML Codes

How To And Where To Upload .swf Files ?

How To Upload SWF Object

What Next?

Recent Comments Widget with Rounded Images for Blogger

Recent Comments Widget code

Use Automatic Read More Jump Break With Thumbnail On Blogger

Add Auto Read More Post Summary's To Your Blog

How to Reset Your Blog

How To Change Older Post And Newer Post Link

ဒိမွာ member လုပ္ရင္ Join this Site ကုိနွိက္ၿပိး Email ႏွင့္ယင္ပါ