Blogging - The Latest Business Marketing Tool

blog-marketing-tool
Blog happens to be an internet journal. These are employed like brief form of internet logs, meaning a listing of writings over the web. Generally, a blog could be a collection of current information, content pieces, personalized journal pages, photos, video clip, business details, item to be marketed, their promotion, etc... Well, the listing really is limitless.

Blogging, the latest buzzword within the business enterprise, is ultimately given a serious attention because of its use, works out well as an efficient marketing tool and as a publicity instrument. Right from the experts in the field of blogging to SOHOs, "how to blog" is the question asked by all with regard to business marketing.

Among the most famous blogs which happen to be business blogs, use their reach in order to market their goods plus establish a business enterprise. Right from the comfort of building towards the ease of connecting with achievable clients, blogging offers a fresh technique for entrepreneurs to accomplish the best promotional approach with regard to their product, so the company should learn all about "how to blog". So, in this article we'll be targeting the business elements of a blog. Moreover, we'll provide you with  tips that can be effectively utilized to advertise various solutions together along with your business.

1. Low-cost online marketing technique: Starting a blogging account over the Blogger happens to be absolutely free. Nevertheless, you should host your personal blog despite the fact that it utilizes a totally free blogging software program. Enrolling your personal domain name plus getting the blog upon your personal server area provides you with effective exposure within the search engine ratings. This suggestion is applicable to all - not specifically for newbies alone.

2. Develop your item or perhaps company image: It is possible to develop your company image by making use of your own blog. Individuals looking at your blog might be intrigued to be aware of exactly what you do and that is the reason, you should include your business button towards your blog. Publish the item information or perhaps submit an infomercial that will be beneficial, not for newbie individual only but for everyone, to reap benefits.

3. Keep a consumer dialog: Blogs need to be interactive, meaning that the visitors should be able to connect with you for your published remarks, and queries. It should facilitate advanced level queries, in certain cases.

4. Obtaining new clients: Several readers might suggest many others to read your blog providing you with new business opportunities. This will be considered useful, not for newbie individual only but for everyone, and will provide them with new clients.

5. Interaction along with other related businesses: Every business operates on inner and exterior networks. Checking up on related blogs, in addition to their posts can, provide you with a way to discuss their articles or blog posts whilst giving importance to these delivering your understanding about the subject. A viewer considering their blog might click-through towards your blog in order to study more. These types of click-through tend to be totally free and produce increased traffic towards the blog.

6. Excellent publicity outlet: In the event, your business suffers from some undesirable pressure, then your blog could be your probability to display a nice and clean standing. It is possible to take a position or perhaps question a public viewpoint.

7. Immediate Feedback: The additional essential feature of blogging is that it allows you to get immediate feedback plus evaluations upon your goods or provide you with suggestions concerning how to make required modifications. This quick, immediate feedback can help you tweak plus react better towards the sector you are hoping to aim. Yet again, keep in mind your followers tend to be your best lead.

Blogs, nowadays, have grown to be a fundamental element of any business. In case you examine best organizations, they have launched a blog to specifically connect with their potential audience. Furthermore, it is the convenient way of educating clients that attract most companies and entrepreneurs. Thus, do not wait and write a blog today to reap the maximum benefits offered by the web.

Shoutmeloud Thesis Theme Customization - Part 6

Thesis-Theme-Customization
I would like to start the tutorial straight away because it's not going to be a cake walk unless your a webmaster like me (just kidding). I guess this was the most awaited customization "SML Featured Content Slider" that every SML blogger theme user wanted to have! I tried my best to match the one on SML however, it's little different from the ideal one! Check out the live demo below...

SHOUTMELOUD FEATURED CONTENT SLIDER - LIVE DEMO

Before I start off, I would like to tell you that this slider will auto slide until an user clicks on the content (the page navigation in the slider). It works with only one script which implies that it's gonna load faster than other sliders. Well, enough of stories... Let's get started!

1. Navigate to "Design>>Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, search for the following piece of code.
]]></b:skin>
2. Download the following text document (includes the CSS and JavaScript to run the widget) - CODE FOR SML FEATURED CONTENT SLIDER. Replace the above code with the code present in the text document.
3. Next, search for the following piece of code on your template.
<div id='main-wrapper'>
4. Place the following code just below the line mentioned at step 3.
<div class='sliderwrapper' id='slider1'>

<div class='contentdiv'>
<a href='YOUR POST URL'><h1>YOUR POST TITLE</h1></a>
Content 1 Here.
</div>

<div class='contentdiv'>
<a href='YOUR POST URL'><h1>YOUR POST TITLE</h1></a>
Content 2 Here.
</div>

<div class='contentdiv'>
<a href='YOUR POST URL'><h1>YOUR POST TITLE</h1></a>
Content 3 Here.
</div>

<div class='contentdiv'>
<a href='YOUR POST URL'><h1>YOUR POST TITLE</h1></a>
Content 4 Here.
</div>

<div class='contentdiv'>
<a href='YOUR POST URL'><h1>YOUR POST TITLE</h1></a>
Content 5 Here.
</div>

</div>
<div class='pagination' id='paginate-slider1'>
</div>
<script type='text/javascript'>
featuredcontentslider.init({
id: &quot;slider1&quot;, //id of main slider DIV
contentsource: [&quot;inline&quot;, &quot;&quot;], //Valid values: [&quot;inline&quot;, &quot;&quot;] or [&quot;ajax&quot;, &quot;path_to_file&quot;]
toc: &quot;#increment&quot;, //Valid values: &quot;#increment&quot;, &quot;markup&quot;, [&quot;label1&quot;, &quot;label2&quot;, etc]
nextprev: [&quot;Previous&quot;, &quot;Next&quot;], //labels for &quot;prev&quot; and &quot;next&quot; links. Set to &quot;&quot; to hide.
enablefade: [true, 0.2], //[true/false, fadedegree]
autorotate: [true, 3000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script>
5. Save the template and your done!!!

Simple! Isn't it? Well, if you think it is, may be your wrong. The actual tutorial starts here! First, write your post title in between the "H1" tags (those highlighted in green). In other words, replace "YOUR POST TITLE" with your post title and don't forget to link it. Replace "YOUR POST URL" with the link to your post. 

Secondly, you need to replace "Content 1 Here" with the snippet available on your blog. Well, the coding will display anything that's under the heaven in the space that's provided for it. Well, coming back to business, it's better if you could find the coding from your "Blogger Post Editor" for every snippet for the featured content. 

Say, for example (from the demo blog), I wish to add "Review On Cannon Power G9" as a featured content on my slider. The first thing I should do is, navigate to "Posting >> Edit Posts" and select the "Edit" link of the corresponding post. In my case, I should select the "Edit" link for "Review On Cannon Power G9". Now, shift the tab from the "Compose" mode to 'Edit HTML" mode. 

Get the coding for the first paragraph of your article with the styles you chose to display the original post. That's it! Paste it instead of "Content 1 Here" in the coding mentioned at step 4. But, please ensure that your "div" or "span" tags are properly closed before you paste the coding and save them!

You may repeat the above mentioned steps for replacing the other contents in the coding mentioned at step 4. Little confused??? Well, just have a look at the example coding given below. The final coding should look something like the one mentioned in this text document - Example Code For SML Featured Content Slider.

I hope the tutorial was an easy fix! If you have any difficulties in getting the slider work or find any bugs, then please let me know via comments! I'll try to fix them! Your opinions about the widget are also welcome! So, share them too!

Add Admin Logo To Blogger Comments

admin-logo-to-blogger
I'm not sure if you noticed the comment section on blogs like "Techiemania" or "SML", they show a differentiation in comments between the admin and the visitor. Well, I do know that there are many tutorials around the web to achieve this effect on blogger but, I'm pretty sure none would be clear because, myself being a webmaster, end up on a confusing state once I complete reading the full article

So, I wanted this tutorial to be clear and pretty easy to install. I hope it is!!! Well, the final effect will be a simpler one - just an admin logo to differentiate between your comment and  your visitor's comment. You may have a look at following screen shot to realize the final effect.
add-admin-logo-for-blogger
The basic coding evolves from the coding for "Multiple Author Info Box Widget".  Well, in my example, I have used a very simple box-type image. You may replace it with any image of your choice. I recommend the logo used by "Spice Up Your Blog". Take a look at preview of the image  here - Admin Logo Image Preview. So, let's get this installed on our blog.

1. Navigate to "Design>>Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, expand your template and search for the following block of code.
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'>
<data:comment.body/>
</span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
2. Just replace the above codes with the following block of codes.
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'>
<data:comment.body/>
</span>
<b:else/>
<b:if cond='data:comment.author == "YOURNAME"'>
<div class='comment-admin'>
<p><data:comment.body/></p>
</div>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</b:if>
Note: We did not use "<b:if cond='data:comment.author == data:post.author'>". If we do so, then every guest author on a multiple author blog would become the admin. So, to avoid that, we've used the idea behind the multiple author widget. If you run a blog with two or more admins, we have the coding for you as well. The same thing has to be extended but I'm sure you will go mad if I explain that. So, it's better you contact me via email for the coding (More than one admin for a blogger blog).

3. Replace YOURNAME with the name of the admin as it appears on the blog post. Well, the major part is over! Now, we need to add the CSS for "comment-admin" div section. To do so, search for the following piece of code on your template.
]]></b:skin>
4. Add the following piece of code just above the line mentioned in step 3.
.comment-admin {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfm4CuEC6DAH400PSEF21KRtdzXBX_bMaymQ15UnZ3MjmmArxUfnb7qQ-1I9-jtKvBH-BsUGMW3XUEWkNFxLX2qdCMctV8gnlUAFBrOfqlffc6XGq_0P6U60BvGXtqL1R2K19wHixAS9z3/s800/admin-logo.png") no-repeat scroll right top #FFF; padding-right:40px; margin-right:10px;}
.comment-admin p{margin-left:0px; margin-right:28px;}
Note: As I said earlier in this article, I have used a simple box-type image to display the admin logo. You may use any image of your choice. If you wish to change the image, then change the image URL - the one highlighted in orange. The padding and margin positions may vary depending upon your blog.
5. That's it! Save your template.

"If you would like to have an unique comment section for your blogger blog, then contact us via our services page and we'll let you know if we can design one for you! We'll install it on your blog too!"

I hope you liked this post. If you face any difficulties, then leave a comment below and we'll try to fix up the issue for you. Share your opinions about this post too via comments!

Google Analytics Newsletter - Just an overview!

Google-Anaytics-Newsletter
I know there are lot of softwares around the web to analyze the traffic, the source of traffic, landing pages and lots more about our website. One such useful software/site is the "Google Analytics". I'm sure many are familiar with it! So, what's new about Google Analytics? Is it the new interface? No! It's about their first volume of Benchmarking Newsletter...

Last night, while I was working on the "Featured Content Slider" for SML blogger theme (Check out the demo - SML Featured Content Slider; tutorial will soon be posted in the upcoming weeks), I received an email which said "Google Analytics Benchmarking Newsletter". I guess this is the first time that the Analytics team sent me an email. The screen shot of the email is shown in the link below.


The screen shot says it all! If you find it difficult to understand, well, I'll just run through a short explanation about the five sections of the email which you may or may not have received.

1st Section - Introduction : This section is basically an introduction about the "Benchmarking Newsletter". It tells you why you received this email and what actually is present in the email (Comparison of metrics  between "November 2009 - Febrauary 2010" and "November 2010 - February 2011"). If you did not receive one, then you need to enable "Anonymous data sharing" for your Analytics Account.

2nd Section - Site Metrics : This section shows a comparison about the "Pages/visit, Average time on site and the bounce rate" for the period under observation (Nov 2010 - Feb 2011). A geographical based comparison about the statistics for your website is explained in the rest of the section. To know more about bounce rate, I recommend you to read the following article - How To Reduce Your Blog's Bounce Rate?

3rd Section - Traffic Sources : This section displays a table of comparison about the sources of traffic to our blog. It just displays the very basic details in the comparison - "Direct Traffic, Referral Traffic, Search Engine Traffic (the one to look out for) and other miscellaneous sources".

4th Section - Operating Systems : This deals with the operating systems that the user used over the period of comparison to visit your website. In my case, more than 3/4th of the users used Windows. I would be happy to see a comparison about the web browsers used to access my website rather than the OS details. What do you think?

5th Section - Comments : This section just deals with the feedback that you may send to the Analytics Team about the newsletter. You may send your opinions to the Team at the following email address -  analytics-benchmarking@google.com. 

Basically, the comparison is displayed in such a manner that even a newbie can easily understand about his/her stats. Well, to conclude, I feel this newsletter actually provides an overview about our stats rather than detailed insights to let us know whether we are on the right path to success. So, share your opinions about the the newsletter with us via comments!

Add Fancy Share Icons To Every Blogger Post

share-icons-blogger
I'm sure everyone runs a social bookmarking widget on their blog. What if we add a little more interactivity & unique style to those icons. This is exactly what we're gonna do in this article! We plan to turn an unordered list of sharing icons into a fancy share box using little CSS & Jquery. The idea is to show the icons partially hidden. When hovered, they slide to the right & become completely visible.

FANCY SHARE ICONS USING CSS & JQUERY - LIVE DEMO

Well, I guess that the demo has impressed you. Before I proceed with the tutorial, I would like to inform you that this particular widget is browser compatible - works on all major browsers. The code was tested on the following major browsers - Firefox 3+, IE 6+, Safari, Chrome & Opera). Enough of the stories! Let's get this installed on our blog.
fancy-share-box-blogger
1. Navigate to "Design>>Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, expand your template and search for the following piece of code.
<div class='post-footer-line post-footer-line-1'/>
2. Download the following text document - FANCY SHARE ICONS FOR BLOGGER. Paste the code mentioned in the text document just below the line mentioned at step 1.
3. Next, search for the following piece of code.
]]></b:skin>
4. Replace the above code with  following piece of code.
ul.sharebox { margin:0px; padding:0px; list-style:none; position:relative;}
ul.sharebox li { float:left; margin:0 0 0 0px; padding:0px; position:absolute; }
ul.sharebox li a { margin:0 0 0 -24px; display:block; }
ul.sharebox li a:hover { margin:0 0 0 -8px; }
ul.sharebox li img { border:none;}
]]></b:skin>
<script>
$(document).ready(function(){
var i = 10;
var j = 0;
$("ul#sharebox li").each(function() {
$(this).css("z-index", i)
if (j > 0)
$(this).css("left", j * 24 + 100 + "px");
i = i - 1;
j = j + 1;
});
});
</script>
7. That's it. Save your template.

Note: The effect is visible only on the post page, in other words, you need to visit the individual pages on your blog to realize the effect. If you want them to appear on all the pages, then just remove the first and the last line of the coding mentioned at step 2.

I hope you enjoyed this widget. If you wish to add a specific icon apart from the list mentioned in the article, please contact me via email with the icon and your template. We'll try to add them for you provided your template has already got this widget installed! Share your views via comments!

Word-Wrap : An Extremely Useful CSS Property

CSS-LogoI'm pretty addicted to web design and photo-shop these days. So, you might encounter a lot of articles related to web design & CSS in the upcoming weeks. Well, just because I post a lot about these stuffs, it does not mean that they are not useful being a blogger. All those tutorials and tricks that I post here will have some relation to your blog. And one such extremely useful but rarely used CSS property is "Word-Wrap"

What does Word-Wrap actually do? To keep it simple, it actually wraps the word or in other words, breaks the word to a new line without exceeding the specified boundaries. For example, when you  look at coding part in some of my tutorials, they would extend beyond the specified boundary(grey box). Have a look at the following picture and you'll understand what I mean!
word-wrap-property
I hope you understood the importance of this extremely useful CSS property - "Word-Wrap".  To illustrate this, I recommend you to read this article - How to add HTML codes in Blogger Posts? So, you got to know "How to include HTML codes in your post?". Generally, this problem of text extending beyond the specified boundary occurs with IE. To make your posts with HTML codes compatible with all browsers(IE 5.5+, Firefox, Safari, Chrome), just follow these steps assuming that you installed the coding as mentioned in the reference article above.

1. Navigate to "Design >> Edit HTML" from your blogger dashboard and search for the following  piece of CSS code in your template.
.codeview {
2. Just add following piece of code below the line mentioned in step 1.
word-wrap: break-word;
3. That's it!!! Save your template.

For users who blog on WP or any other platform, just specify the following tag in the CSS part of your template. It's not necessary that you use it only for displaying the coding stuff - use it anywhere you want the word to wrap by itself within the specified boundaries.
word-wrap: break-word;
To extend them beyond the boundaries (definitely not the idea behind this post), either remove the tag specified above or change the parameter from break-word; to normal;

I hope this simple tip enhances the design of your blog - to keep it neat and clean. This CSS property comes in handy especially for webmasters and web designers. So, share your views about this post. Your comments are always welcome!
[netinsert=0.0.1.11.14.1]