Tuesday, September 29, 2015

How to centre-align the sharing-icons from AddThis in Blogger

This article shows how to get and then centre-align the row of sharing items that you can get from AddThis (and it's likely that a similar technique applies to sharing buttons from other services like ShareThis, too).



If you think that Blogger's own social sharing buttons a just a bit too small and difficult position, then you may decide to use a service like AddThis to generate buttons that are more elegant all round.

Signing up with AddThis is easy: just log in to your Blogger account, and in a separate tab open up AddThis.com. Choose Create Account, and then Continue with Google. This links your Google account and your AddThis account, and is the easiest approach - but there are other options too, like creating your account with your Facebook or Twitter accounts, or even just signing up the old fashioned way with your email address.

Once you have signed up and chosen a plan (personally I just the free "Basic" plan), you need to actually install the AddThis buttons on your site. To do this:
  • Select one or more sets of sharing buttons (from the options available to your account type),
  • Choose the settings which apply to that set of buttons
  • Choose Activate (button in the bottom right corner of the setting screen), and
  • Install the code that AddThis gave you into your blog.

Installing the code that AddThis gave you is pretty much like installing any other piece of code.   Typically the code you have to install has two parts:

For the piece that says:
Step 1: Add the following code to the <body> of your website.
Search for "<body"  (note:  no closing angle-bracket because some templates have extra instructions in there), and then put the code from AddThis after the angle bracket that goes with the <body


For the piece that says:
Step 2: Paste this code into whichever page you would like this tool to show up.
Find the location in your template that you would like the gadget (eg an HTM gadget, or inside the post statement itself - read more about the options), and copy and paste the relevant code from AddThis.




But it's not in the right place.

If you install the code as is from AddThis, you will find that the row of sharing buttons is pretty tightly linked up with the rest of the page, and left-aligned.   Fortunately this is easy to change.


How to centre (or right align) rows of buttons from AddThis 

To put the set of sharing buttons from AddThis at the middle of the page, you need to surround the 2nd piece of code from AddThis with another Div statement, like the one in bold below:
<div style = 'width:100%; text-align: center; margin-bottom:3em; margin-top:2em;'><!-- Go to www.addthis.com/dashboard to customize your tools -->
<div class="addthis_sharing_toolbox"></div>
</div>
The exact details to use depend on how exactly you want to set up your sharing-bar form AddThis.  I wanted it to be centre-aligned on one of my sites, with some extra white space above and below, so I used these commands:

  • width:100%  -  says to use all of the page-width in deciding where to put the sharing bar  (by detfault, it would just use the width of the sharing bar itself
  • text-align: centre   -   means that he bar will be put in the middle
  • margin-bottom and margin-top   put some extra space above and below the gadget, so it sticks out more-so.


But you may use a different approach, depending on what your blog is trying to achieve.

What your readers see

Visitors using a web-browsers

Will see your AddThis buttons, as you defined them

Readers who subscribe to your blog's RSS feed

Will not see your blog's AddThis sharing buttons, unless they happen to click through from their feed-reader to your blog.

Readers who follow-by-email 

Will not see your standard social sharing buttons at all, unless they visit your site.   (AddThis does have some email newsletter buttons, but these don't automatically go into emails generated from Blogger).


Is it worth it?

For what it's worth, I recently made the change from custom sharing buttons that I'd made myself to classier looking ones from AddThis, and saw quite a jump (50% or more) in the number of social shares, across all my sites.

YMMY, of course.



Related Articles

Installing 3rd party code into Blogger

Using Div statements to control layout

Evolution Of The Office (Then/Now)

We take going to work at the office everyday for granted but do you ever stop to think just how much office life has changed over the years?

This infographic by Smart PA is full of facts and visuals with key dates in history that have changed the business world allowing it to grow and develop at a faster rate then ever before. From telephones and computers being introduced to air conditioning and video conferencing. We wonder what the future may hold for office life going forward….




Evolution Of The Office (Then/Now)

Wednesday, September 9, 2015

Why Cabs Are Slowly Replacing Auto Rickshaws in India?

In the last few years, large cab companies have popped up across the country. Meeru and Dot cabs were some of the first few to be launched on a large scale. Back then, the cab service was too costly and only a handful of people were using it. But now, with cab companies like Uber and Ola, there’s a slight chance that cab companies will slowly erase the Auto Rickshaw concept from India. Here why.

Price

Price of auto rickshaws over cabs

One thing stopping people from using cabs so easily was the obscene rates they charged passengers. But today that has changed. With the coming of new cab companies, some cabs have even become cheaper than autos! Now tell me why in the world would you travel in an auto when you can have a comfortable ride at such a cheap price.
 

Comfort

Comfort in a cab

Cabs have air conditioning, proper seats, speed and a smooth ride. Ever since cab companies are offering such low rates, it became hard to justify why one should travel in an auto. When you can have such a smooth and comfortable ride at such low rates, cabs are the perfect mode of transport for anybody. This difference has already effected auto rickshaw drivers negatively as their previous customers are slowly shifting to cabs.
 

Free ride concept

Free ride concept

Cab companies have a unique ability of offering free rides for their customers. Ola cabs coupons and Uber promo code have become a rage in urban cities. People use these and ride around at discounted rates. Sometimes these coupon codes even give free rides which is really making people to prefer using cabs. Discounts and free rides are not something auto rickshaws can offer. This way cabs have an upper hand.

Convenience

Convenience while driving

Using cabs is always more convenient than autos. You can book a ride in advance and expect it to come on time. Cabs are also available in abundance today. So you can even book a cab on the spot and track it over their app. Another unique feature is how drivers are equipped with GPS devices. That way, even if you don’t know the way, the driver can find it over the GPS and take you to your destination.

So it is quite clear, cabs are a much better option than auto rickshaws. The only thing holding them back is the awareness of their service. The more people realize the advantages, the less they will use autos.





Author Bio:
Sravanthi is an employee at GrabOn.in. She is an avid reader and writer too, and has good experience in blogging. She loves to pen down her thoughts on a wide range of topics. You can spot her blog postings on a large number of blogs and websites.

Tuesday, September 8, 2015

How to put pictures into unusual shapes, using PowerPoint

This article explains how to put a picture that is one shape (a "square peg") inside an image of another shape (a "round hole" - or star, elipse, octagon, etc) - using Microsoft PowerPoint.

Original title:   How to put a square peg into a round hole - in pictures


Wooden clothes peg in a customized rectangle with rounded corners.
Recently, I've been using PowerPoint to make the thumbnail image for my posts. This means that I own the copyright of the pictures, so can share them without worrying about copyright issues.

One approach I've used is to find an interesting copyright-free picture that is related to the theme of the post, and then put it inside a shape that adds some visual interest or has some words along side it.  Another thing that I'm going to try is using multiple pictures in this way to make a more-interesting-than-usual collage.



How to put a picture inside a shape

NB PowerPoint commands are based on Office 2007 and 2010 - but the same principles most-likely apply in other versions where the commands may be slightly different.


1   Get your image file, and save it somewhere on your computer.

A wide range of picture-file formats are supported by PowerPoint:  in the 2007 version this includes as shown in this list:

2     In PowerPoint, make a blank side (Home > Layout > Blank)

3     Then add a shape (Insert > Shapes, click on the shape you want)



Intially, the shape with have the fill-colour and border that are the current default values. But you can change this, which is what we are going to do.


4    Right-click on the shape, and choose Format Shape from the pop-up menu




5    In the Fill tab, choose Picture or Texture Fill, then click the File button and navigate to the image file you got in step 1, and click OK.






6   Make sure that the portion of the picture that you want to show is in the picture:  to start with the shape is centered on the middle of the picture.

Change this using the Offsets to move the shape to the left or right over the image.   You can make the offsets positive or negative as shown.

You can monitor the results of different settings in PowerPoints slide thumbnails (on the left hand side, if you have it showing), or by dragging the pop-up menu to a different place in the screen so that you can see the shape itself.




Job Done - at this point, you have an image that is cropped to the shape that you chose - now you just have to put it into your blog.



Using the picture


There are (at least) three ways to get the shape-cropped-picture from PowerPoint into your blog.

I usually copy the item from PowerPoint, and then paste it into a picture editor (Paintbrush etc), manually.   This is an old-fashioned approacb - but it lets me adjust the size and position of the image, and save it (usually a .png) with a file-name that describes the image really well which is good for mating the blog come up in search results (SEO).   The this picture can be inserted into a post just like any other picture.

Another option is to choose File > Save As from Powerpoint, and choose to save the slides in an image format, eg JPEG which can also be inserted into a post in the usual way.  You are likely to be asked whether to put all the slides in one image, or to make one image per slide. Usually, it would be best to make one image per slide - but I don't use this method because the image that is created is the size of the whole slide, rather than just the pictures on it.

A third option is to display the PowerPoint file as a slideshow. This isn't something that I'd do for only one shaped image, but may be relevant in some situations.


Adjusting the size and quality of the picture


One thing that you don't have any control of inside PowerPoint is the zoom level of the inserted picture.

If you make the shape larger, it doesn't show a larger proportion of the picture. Instead, it just shows the existing picture in a larger size, as you can see in the slides shown here.

I suspect that if you want to zoom in to a particular area of the image file, the only approach is to edit the picture in another tool, crop out the bit that you do not want to show, and only keep the part that you want to include inside your shape.

However PowerPoint does have some limited control over the contrast and brightness of the picture, from the Picture tab of the Format Shape window.


Can you do this in other tools?  Why PowerPoint?


Yes, you can.

Photoshop, and similar commercial tools almost certainly have features like this, and I'm certain that GIMP (like a public-domain, less powerful version of Photoshop) and Inkscape (another public-domain image program which is more focussed on scalable-vector-graphics and objects than on pixels) also have these features.

So why use PowerPoint?   In short, its (relatively) cheap and many people have access to it already.   It's also very easy to learn, compared to the other packages, and what you learn is likely to apply to lots of tasks and not just in making pictures for your blog.




Related Articles:



Putting a picture into a blog-post

Post.thumbnail and post.summary - ways of describing blog posts

Showing a PowerPoint slideshow in Blogger

Copyright, blogs and Blogger/Google