The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

The KinG Of Fire

Monday, February 13, 2012

How to Make Box Space Banner Ads In Blog



Features of the 125x125 ad templates:
  • Flexible, the composition of which appears in accordance with the width of the widget.
  • Border effect radius.
  • Effects Transparency / Opacity when the image is hover.
  • Easily be edited in order to put an image ad and link.
  • By removing the width and height, this ad space template can now be used for various types of banner ad sizes, 125x125, 300x250, 468x60, etc.. Use the image to fit the desired the widget space ad will appear according to size.

How to Install Banner Ad Space Box in Widget Blog:

1. Go to the dashboard> template / design <Edit HTML
2. Copy the following CSS code and place it in the UP ]]></b:skin>
#bukarahasiaads {margin:0px;padding:0px;text-align:center}
#bukarahasiaads  img {margin:1px 1px;text-align:center;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;-webkit-box-shadow: 1px 2px 1px #ccc;-moz-box-shadow: 1px 2px 1px #ccc;box-shadow: 1px 2px 1px #ccc;}
#bukarahasiaads img:hover {-moz-opacity: 0.7;opacity: 0.7;filter:alpha(opacity=70);}
Change the value of the margin: 1px 1px to adjust the distance of the image ads. Under the distance above the first value, the value of both left and right distance.
3. Save Template.
4. Buka layout/design > Add a widget > Pilih HTML/Javascript.
5. Copy kode HTML berikut (edit terlebih dahulu untuk memasukkan link dan url gambar gambar yg ingin digunakan):
<div id="bukarahasiaads">
<a href="INSERT-URL" target="_blank" title="ADVERTISEMENT TITLE"><img alt="ALT / TEXT IMAGES" border="0" src="URL IMAGES" /></a>
<a href="INSERT-URL" target="_blank" title=" ADVERTISEMENT TITLE"><img alt="ALT / TEXT IMAGES" border="0" src="URL IMAGES" /></a>
<a href="INSERT-URL" target="_blank" title="ADVERTISEMENT TITLE"><img alt="ALT / TEXT IMAGES" border="0" src="URL IMAGES" /></a>
<a href="INSERT-URL" target="_blank" title="ADVERTISEMENT TITLE"><img alt="ALT / TEXT IMAGES" border="0" src="URL IMAGES" /></a>
</div>
If you want to add / subtract box ad space to add / delete sections:
<a href="INSERT-URL" target="_blank" title="ADVERTISEMENT TITLE"><img alt="ALT / TEXT IMAGES" border="0" src="URL IMAGES" /></a> di atas </div>.
6. Save. Drag / slide the gadget into the desired position, for which the size of a large and wide, place the widget in the header or above the post. Save again.

You can use the following images as image advertising space (size 125x125), for other sizes or who want to taste & design blog, can be found in Google with the keywords "space banner image ads (banner size)". Upload images, change the URL to the url FIGURE pictures that are uploaded already.



Note: Host / upload your own pictures. Do not just use the url above image for a picture at any time can be lost / deleted. Right-click on the image, save as to a computer, then upload.

A Brief History of Blogs and Blogging

sejarah blog
Friend, of course, the history of blogs and blogging is not going to be written at length, though in fact there is a process that is not exactly short. The outline of this article is to give an idea of ​​how blogs and the blogging world can be formed. At least we can know what the background and motivation of blogging at the time and could also ask ourselves about what exactly our motivation to create a blog.

 
 
Who first nge-blog?
Justin Hall, a student Swarthmore, USA, started his first blog in January 1994.
 
How the process of formation of Blog?
Process and the vagaries of history is an interesting blog. The term blog is short for weblog itself, namely the incorporation of the word 'web' and 'log'. Its meaning is the web that contain information a continuing series of events, therefore the blog is always identical with its content be updated.

Weblogs have many links, both internal link (which is usually in the form of articles of the weblog itself) and external links (derived from weblogs and other websites). These links are displayed in a list in chronological order or category. The word was popularized by Peter Merholtz Blog in April or May 1998. Peter himself is the founder of Meholtz Open Diary is an online diary of the writers around the world, which then also has a blog service. Open Diary is also a major contribution in the history of blogs and blogging.

Initially, the weblog consists of several components of the manual as well as websites in general. During its development, there is the addition of new features that are different from the website, such as web articles posted in reverse (from the oldest to the new one) and chronologically, and allows a thread devoted to discussing a post articles. Publication of the article was becoming increasingly easy and do not require technical skill.

What is a Blogger?
Bloggers who write blogs. In the original language, the word "blog" is a verb (the verb) and noun (noun). So that when there is a blogger said, "I blog", it means a job or hobby is writing a blog. Simple as that, however great its intrinsic meaning. Penggarisbawahan the word 'write' to indicate that a blogger is a writer (author / writer). So, the blogger does not mean blog owners only, but active people to fill the blog with his writing. In fact, not necessarily a blogger has a blog, but he remains despite his bloggers to write for other people's blogs. Conversely, someone who has a blog but do not perform the act of writing, it is not a blogger.

What is Blogging?
Blogging is the act of writing, both in the blog as well as writing a comment (comment) on specific topics and articles.

While Blogger.com is a free service site the first time (1999) who provide care facility and making a personal journal (blog). Blogger establishment is then touted as the beginning of the creation of the blogosphere. Google bought it in 2003.

Bloggers Moving Faster
Blogging is becoming more and more demand activity that also increases the number of bloggers in the world. This impact on the rapid flow of information and wide and the speed of publication of such information. Thus, the mainstream media often turn to follow the development of the information in the blogging world and also become followers (followers) of the bloggers. But sometimes the blog also reiterated what was already presented by the mainstream media and provide specific comments.

Blogs are becoming a tool to convey expression and information presented in an easy and simple, making it easier for people to get information in a nutshell. The majority of readers do the scanning (pick and choose, sometimes also called fast reading) rather than intensive reading (read diligently, listening).

Blogging for a Job?
Blogs and blogging is growing. Some bloggers became famous for the many fans of their articles, even to the entire world. It is attracting the interest of many commercial enterprises to promote their products, whether it be the ads displayed or written. The result, not a few bloggers who earn money from blogging and make it as a job. Currently, the revenue was no longer just from the advertising and promotion, but also as a guest blogger who is paid, fill seminars, online business programs, and so on.

There is also a visionary and blogging activity as a hobby. Blogging is a means of expression and communication are most effective, because it can spread throughout the world and without any limitation. Many also of those who later became famous and was a speaker in various fields, in addition to the background because they are the ones who are good and experienced in their field.

 Whatever it is, good value for money, hobby, or fame, for blogging is to write and communicate information, experiences and thoughts, then all is fine.

Blog Loading Speed ​​up the Optimization / Compress CSS

CSS Compression-Kompresi CSS, Percepat Loading Blog
What is the relationship with the CSS load time (load time) blog page? The most simple, the size of the CSS file to determine how many sections to be read by the browser. The larger the file, of course, the more command language, so 'reading time' required by the browser even longer. You can use the website / blog speed test tool on this blog to find out the speed of loading your blog.
After changing the template some time ago, a problem loading the blog tends to be longer than the template appear before them. Of course this effect is not good. Yang first effect is the inconvenience visitors. Even more so when there's impatience and then embodied in action "Close wrote aaaaah, i lazy, lo-la bangeeetzz". Secondly, Google is currently performing a penalty for the website / blog that has a load time is too long. As a result, ranking in the search index can be dropped, in other words, SEO is weak.
One thing I did was attempt to compress PNG images with PngGauntlet. The result is rather to reduce the size without reducing image quality. In addition, other steps are performed, one of them: streamlining CSS. Hopefully loadtime now been reduced though not maximal (hopefully eventually ga ya).
Back to the CSS. CSS file is the entire contents of the CSS style rules that exist in the template HTML, XML, and others. All rules are then summarized into one as a file that is read by the browser. Well, in this section, there are many rules no need to remove so that we can not take the space as more and more space the greater the file size.
Then how do I reduce file size CSSnya?
 
1. Manually do the editing CSS.
There are a few examples of the following rules:
For example, rules on the header-wrapper,
#header-wrapper {
background: url(http://www.freeimagehosting.net/uploads/e439563253.jpg) no-repeat #000;
height: 150px;
margin-top: padding: 0px 0px 0px 0px;
text-align: center;
border: 1px solid #000;
}
Contoh di atas adalah penataan CSS secara standar, dimaksudkan agar browser dapat membaca aturan dengan baik dan urut. Namun pada saat ini, semua browser telah memiliki kecepatan dan kemampuan baca yang tinggi (anda sudah tidak pake IE 6 yang kuno itu lagi kan?), sehingga aturan seperti di atas tidak menjadi hal wajib. Aturan di atas memiliki white space (sisa ruang) dan juga spasi. Kita dapat melakukan perampingan pada ruang-ruang tersebut. Contoh:
#header-wrapper{background:url(http://www.freeimagehosting.net/uploads/e439563253.jpg) no-repeat #000;height:150px;margin-top:padding:0px 0px 0px 0px;text-align:center;border:1px solid #000;}
In the example the following styling:
{Margin-top: 15px;
Margin-right: 10px;
Margin-bottom: 15px;
Margin-left: 15px; }
Style margin above can be streamlined with CSS short-hand and reduce spacenya:
{Margin:15px 10px;}
Because the upper and lower margins as well as the right and left together, we can streamline the way over, which represents the size of 15px and 10px below the top-right-left represents. If all the same margin, for example 15px, we just write: {margin: 10px}. Note that all the rules and walk starts from the top clockwise: top, right, bottom, and left.


2. Use the Service Provider sites Compress CSS Online Tool
Well this is the easier part. You can use some CSS compression tools and services at a glance you immediately get the result. Please visit:
Or you can search other sites by googling with the keyword "css compression tool".

The steps:
a. Copy all of the CSS rules template HTML / XML.
b. After logging into the site CSS compression services you select, paste all the code and click 'compress', 'optimize', and ebagainya lains.
c. Wait a few moments and complete results will come out with the last file size after compression and comparison. Even small differences will greatly affect the reduction loadtime page.
d. Download backup template prior to edit HTML pages.
e. Delete section where you copied earlier and enter the result aturanCSS compression to the part.
f. Preview and if there is no problem anymore, save.
clue:
The whole CSS code located on the head. More precisely, all CSS code display manager is located between <b:skin> and]]> </ b: skin>.
Select the type / compression options 'standard' or the like on CSS compression tool you use.
Good luck and hopefully useful.

Tips: How to Create and Build Blog Effectively

Each Blogger, would want a good progress and developments on his blog, both in terms of content, appearance, traffic, popularity, to the financial aspect. Often, because of the limitations of the reference and the influence of some of the discourse that is not constructive, the Blogger newbie stuck on the ways in which the actual instant away from giving results as expected. Thus it is extremely important to create strategies that cooked, simple as any, so that blogs can develop and produce something that is encouraging for the Blogger.
If the steps have to be called as an error due to ignorance, many Blogger had an understanding that all things can be done instantly, both in making and in building a blog. So, sometimes they get stuck on the use of methods that are not good and misleading. Whatever the goal, something that is reached by way of a good surely would meghasilkan something good also.
I created this article as a share of some experience when creating and building a blog, which of course a lot of trial and error as it was with another newbie Blogger.

Making Basic Tips Blog (internal Step)

After learning how to create a blog, any blog platform, it should be understood that a blog is not a short process. However, a blog is the process by which the construction and blog elements arranged so as to form a basis of appearance and content of the already visible to the reader / visitor, at least there are several stages in preparing the blog:a. Develop a unique domain name that no one owns it.b. Registering a domain to a blog service provider / or a direct-hosting on its own.c. Perform the verification process and finally to the url terbuatnya blog, which means a blog was born.
At this point we often think of all was in order. Then, at random, we began a massive post. In fact, due to meet the demands of the number of posts which have seen a lot, a blogger do not hesitate to copy and paste the mass of several blogs at once. This method is actually a lot of effort to make a good blog and not at all effective.Here are tips and next steps on the stage and the process of creating a blog:A. Focus on the construction of the first blog, do not think about the traffic / visitors. If you need to set access to a private blog where only you can access it.
2. Look for theme / template as you wish while meeting the criteria in accordance with the blog topic is brought about (including personal blogs). In the process of the future, will very likely bregonta changed template. However, it would be better if it's minimized, or at least only be done at an early stage. Furthermore, the blog is ready to step to the previous template has been tested and selected. When this has been a lot of templates / themes and free premium quality.
3. Select the widget to be aggregated and posted. Focus on the use of widgets whose function is clear, such as navigational tools, the community (follow) and statistics (traffic / visitor / pageview). Actually very reasonable to try a variety of widgets (called also curious and want to see results, right?), But note the correct function. Avoid sweetened widgets that are not important, rather than just add weight and create a blog visitor interrupted. I am often greeted with a widget / plugin javascript pop up window type when visiting a blog: "Hello, write your name, your age, your gender?" My question, "Does it matter?" I feel very annoyed, because I need is to read the blog article, instead of following the population census. :) Avoid such widgets.
4. If necessary, create a new blog that serves as a laboratory for testing templates and widgets, so if you think thats right, just installed in the main blog.
5. While doing the above steps, make a posting on a regular basis. Relax, do not hurry. Writing in a relaxed state and a clear mind can produce paper-weight, simple as any subject.
6. A blog is a vehicle for displaying the discourse, make sure your blog has to have enough articles before being cast to a wide audience. 5-10 I think the article is enough to be the start of the opening introduction of a blogger and his blog.
7. One to two months is not a long time to make the foundation of a blog that really sturdy. Cultivate understanding that all the above process can not be done in a day or two. If the analogy just as the house which I built, it must be ascertained whether the foundation is prepared really strong and ready to be stacked with other building materials, and that it was not exactly instant.

Building Basic Tips Blog (External Step)

Once the foundation is planted in the ground is certainly strong enough, then now is the time to build a wall up to the roof, the parts that have been touched by the atmosphere. This stage involves a lot of external things which blogger started the move to promote / introduce her blog to the public.
A. Bertandanglah to other blogs, get acquainted, and comment as much as possible. Prioritise the blogs are still new. Why? The possibility of getting a response and a visit back will be much bigger and faster. Attitude of other bloggers who have the same condition would be disconnected because the interaction is more balanced. It would be very difficult to obtain the senior bloggers who incidentally has the same activity together with blogger blogger-sepantarannya. Not mean to discriminate, but if the analogy, if you will bertandang and play with high school kids while you're still 6th grade? Of course bloggers demanding that such a standard is not quite as easy. All there stages like when climbing stairs. Climb the stairs instead of five are at great risk and jmenghilangkan the process that should be spent in socializing and learning.
2. Berkomentarlah with quality content. Why? Because the content of comments which will weigh more interesting than random. Give opinions in an article or ask things yan can provoke enthusiasm for the blog owner to answer. In this way, a visit back will have a large enough percentage of likelihood. Avoid comments that only "jeplak origin", because of your quality as a new blogger is also assessed from these factors. It will also attract senior bloggers to first consider your presence.
3. Having got to know and socialize with fellow Blogger, began also to the stages of introducing blogs to search engines and enhance its SEO, both on-page and off-page. A bloggger who want their blogs bustling visitor can not rely on visitors from the blogwalking only. Therefore, this stage began to be a very important step and should be constantly carried out.
4. One way to strengthen SEO and search engine indexes is to diligently commenting on blogs as a way before. Was also commented on dofollow blogs. Use a blog as a link url and blog name as the name of the commentator (anchor text) when filling out the form identity commentator. Again, I reiterate, berkomentarlah with quality comments because it would also be considered by the search engines. For a new blog, optimize your link building blog homepage link advance than other pages (posts).
5. Register your blog and articles to directory sites and social bookmarking. This will increase the visibility of their pages and their blogs.
6. Be active start to follow the blogger forums and public forums. Create a post with a topic / discourses. Make sure the link is listed on the blog post as the source and identity. Posting of the article does not have to explain something, but can also be opinions, questions, and anything that requires a response. Site forum bloggers in Indonesia such as the Indonesia-blogger.com and www.planet-blog.com. For international directory, for example, is technorati.com (see also other blog directories in the footer of this blog widget).
7. Keep hunting directories blog / website and social blookmark. Use the search engines as a search tool that is proven effective.
8. Expand your network and the popularity of the blog by using social media like Twitter and Facebook. You can publish articles, hook the follower and fan (likers), promote and expand the reach of communication.
9. Still continue to make posts. Wealth and resources is an article blog. But do not force yourself to write as much as possible. Write with a capital of mood and spirit. Quality and original articles will have the opportunity to get a lot of other bloggers who linkback to copy and paste it. If there is no source link, ask. This is for originality and credibility of blogs as well as to increase the popularity and visibility of the blog.
10. Perform an analysis of small-scale (large-scale too fine ding), against traffic blogs, both in terms of number of pageviews and visitors. Use the statistics features which have been provided peyedia blog blog services (platform) or other site where the widget traffic / visitor / pageview been previously installed. Note the progress and see if there is improvement or not.
11. Also check the condition of your blog in search engines (Google) via Google Webmaster Tools or Google Analytics.
12. Register your blog to Alexa to know the progress of rank (rank) blog traffic.
13. (Optional) Be a guest blogger (guest writer) on blogs that offer.
14. Step number 1 through 12 are the steps that must be done simultaneously and continuously as long as you want to continue to have a development blog; both in terms of quality, popularity, traffic, and financial (for which to monetize his blog).
15. Be patient and enjoy the process.




6 Free Chat Widgets For Your Blog


 
Cbox is one of the popular chat and shout-box tools. Many blogs embed this chat tool. We can see it anywhere around. One thing I like from this tool is that it is secure. You can be sure to control any spam yourself  by having the ultimate control on it. It supports avatars and smileys, but of course, for free use, ads will be embedded either.


Gabby is a chat tool service that supports and provides RSS. It has audio functionality and pretty look. All you have to do is just 'gab' your blog url to get this tool.

Zohochat is easy to set-up, slick, simple to use, and has a professional-look. You can choose whether it is for shout-box or live chat. This one is what I recommend most.


Freeshoutbox is basically formed in HTML, so you can easily embed this tool anywhere you want. You can choose more than 200 templates if you are a bit 'lazy' to customize the details. What I like most is that this tool supports auto refresh: 6 per minute, whether Shoutmix: 1 per minute, and Cbox does not support this feature at all. You can also ban an IP when you find it annoying. Ads embedded below the box.


Well, because Oggix is one of karya anak bangsa, so I simply got to say in Bahasa Indonesia sajah (lebay dikit gapapah....lah ^_^). Shout-box ini adalah karya dari Mas Oggix, men-support smiley, avatar dan tidak membatasi jumlah entri chat. Bahkan anda juga bisa memasang lebih dari satu shout-box di  satu blog /website dengan satu account saja. Ajax platformed. Just give it a try here.

Yoo-hoo, there are of course many other chat/shout-box widgets to find and consider. Just type some words on Mr. Google.

Oops! I forgot to present one other tool; that is: Shoutmix.  The service enables you to modify the appearance of your widget by employing many optional themes, as well as custom CSS. This tool is able to filter profane words from being displayed on the shout-box.
Have a nice try!

Sunday, February 12, 2012

Star Rating widget For Blogger Posts

Star Rating widget For Blogger Posts one of the beautiful widget to rate the post. Now its very easy to add star rating widget below each blogger posts.

If you wanna add star rating widget like below to your blog, Just login to your blogger with draft.blogger.com instead of blogger.com.




Now Follow this path:-


LAYOUT > Page Elements > Edit Post Box > Select There Rating Widget > SAVE


Now View your Blog , you will see the rating widget below every post.


This will only work if you are using uncustomized blogger template by google.


If you are using customized template or third party template on blogger. Then add these few codes to your blogger html.

Layout > Edit Html > Ctrl + F

Now,
Search For <data:post.body />


Add below codes Just after this green line



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='180'/>
</b:if>
</span>
</b:if>


Now Find This Line <b:include name='nextprev'/>


Add Below codes just after it




<b:if cond='data:top.showStars'>
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("annotations", "1");
function initialize() {
google.annotations.createAll();
google.annotations.fetch();
}
google.setOnLoadCallback(initialize);
</script>
</b:if>



Now Save Your Template. Its Done View Your Blog.

A Beautiful Post Rating widget is now added below your each post of blogger.

Related Posts Widget With Thumbnail Preview For Blogger

Related Posts Widget With Thumbnail Preview For Blogger,as we all use related posts hack to show of the related posts in particular category below our posts as this helps our readers to move through our pages easily.The basic difference is that this widget adds thumbnail from that particular posts as of previous related posts widget just show of the link to post.

You can see how the thumbmnails will look in the widget in below picture.


How to install this widget in blogger.

Just visit Linkwithin.

Give your Email adress,blog address and select suitable blog platform and grab the widget code.

Now You will get install widget button click it,if you are logged in to blogger it will intsall widget directly or login in new window else you just get the codes and add codes manually in your sidebar in html/javascript page element.

Tweet Button For Blogger By Twitter

Hi friends its good news by twitter that they released the official tweet button for doing tweets to our blog content and help more in sharing it on twitter.As previously we used the green retweet button on our blogs for making our readers to share our post with it.As the button was made by tweetmeme, but now they joined in hands with twitter and has released the tweet button officialy on twitter site.You can see tweetbutton live.

They have made it now more beautiful and still available in both vertical and horizontal styles with one more button added that is without count.Check the three buttons available below in picture.



Now i would like to tell you how to add these buttons to your blogger blog.

Just go to blogger Design > Edit Html and expand the widgets codes by chekcmark it.Press Ctrl+F and find for this code in blogger <data:post.body/>

After getting it just place the below codes after it,if you want button to have at beggining of post else place it after the code you found to have button at the end of the post.

For vertical button




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right; margin-left:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="TWITTER-USERNAME">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
</b:if>


For Compact Button




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right; margin-left:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="TWITTER-USERNAME">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
</b:if>


For Button without count




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:right; margin-left:10px;'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="none" data-via="TWITTER-USERNAME">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>
</b:if>


Now just little bit about customizations in it.

1.Use the green starting and end lines only if you want to show buttons only on your post page else remove it.
2.Enter your TWITTER-USERNAME written in bold black to show its shared via you if not want remove bold text.
3.Some portion is marked red.Its just simple css to postion your button.Make it float left or right where you want and margin also from left or right of the post.

I am sure now you will be able to add these buttons to your blog easily.As you can get the codes for these official buttons here at twitter goodies.If you didnot like these official buttons by twitter you can also use these old retweet buttons by tweetmeme for your blog.

If you have any problems in adding these buttons to your blogger blog leave your comment here i will help you out.

How Auto Adjust Images Size In Blogger Posts

How Auto Adjust Images Size In Blogger Posts,yes friends many of us would be daily posting some images in there blogger posts or would have photo blogs and would be tired of giving the width and height to there post images again and again to adjust and look good in there blogs.And dont they think when they will switch to new template the width and height assigned to images in post can create problems for them.And many of blogs would be facing problems if they post images with width longer than post section and image would overlap the sidebar and if not overlapping then only part of the image in post section will be visible rest part hidden.So i will be telling you on how to auto adjust images size in blogger posts to suit your blog needs.

Now Please look at the pictures carefully to know what i am exactly talking about.

Suppose you have post section of width 500px and you post a picture of width 800px in the post without defining any width and height to it.Note if you uploading through blogger editor it automatically define width and height to image so will never face error in that.

The image would appear in post like below two methods.

1) As image width was 800px,Image width get shortened and will show up in post upto 500 px and rest 300px will be hidden.



2) Full Image is shown but overlap the sidebar.



But the proper way the image should be shown in blogger post should be like below.



So to make it correct i am making you learn this css property for your blog,if you are facing any of these problems.

As say you have an blog and want to show images of width equal to post section i.e you have post section of width 500px and you want to show images to autoadjust to that size in your post.For doing that just go to blogger Layout >> Edit/Html and add the below codes before ]]></b:skin> tag :-


.post img {
max-width:500px;
max-height:500px;
min-width:200px;
min-height:200px;
padding : 10px;
clear: both;
}



Just adjust the properties min-width,min-height and max-width and max-height.As after using above codes now in your post the image width and height will never get less than 200px and not more than 500px.So image size will always lie between 200-500px.If image size is less than 200px it will auto adjust to 200px and if more than 500px it will autoadjust to 500px.

Now if you wanna use all images in your posts of same height and width i.e mostly used by all photo blogs to show of all the images of same sizes.You can use below codes.


.post img {
width:500px;
height:400px;
padding:10px;
}


Now all the images of any size in post will appear to auto adjust to size of width 500px and height 400px.

**Note:- If not working properly , there might be image property defined in your template,just find for it and check it.Find for .post img tag to check it.