Subscribe to BT To Get Latest Blogger Tutorials For Free

Blogger Templates: Gumball Special

Gumball Special Premium Quality 4 Columns Blogger XML Template

Gumball Special is originally a 4 columns Blogger template. Due to it's incompatibility with Blogger and a lot of issues, it is no longer available to download.
Features: white, pink, 4 columns, fixed width, search box, RSS feed.




78 comments:

  1. hi,

    thanks for responding so quickly. sadly, i cannot use the new code since it is in rar format instead of xml.

    what can i do?

    thanks, beth

    ReplyDelete
  2. hi. can you explain how to use a RAR file, the file download for this template is in this format instead of xml.

    ReplyDelete
  3. rar file is just a format to compress a file, the XML template is inside that rar file and you need any compression utility to open the rar file and extract it. you can use "Winrar" or "Winzip".

    here is the direct link to download winrar

    http://www.rarlab.com/rar/wrar380.exe

    ReplyDelete
  4. hI ZEEROCKZ,

    thanks for all your help. it took me a little while to get to the right code on the winrar, but that's probably because i don't know what i'm doing. i've finally got everything in, and my comments are now lined up like they're supposed to be, thanks to your help. but i have one more little think. i would like to be able to change the color of the hypertext on the comments page and in the articles, but i cannot since the fonts and colors page doesn't work when we use this template. if you can help me do that, i'll probably not bother you anymore. =) thanks again

    ReplyDelete
  5. I downloaded this...why doesn't the top widget line up with the main content boxes in the middle?

    ReplyDelete
  6. Also, it would be great if the images in the posts were resized on the main page....my images in my posts are huge and look silly.

    ReplyDelete
  7. Widget Line up Problem:

    Guys, if you have widget line up problem, please download the template again. I've fixed that recently.

    Images Problem:

    I'm using the same template on my site and as you can see, images don't show in full size. On the main page, only that part is shown which is in the post box. Can you please send me your blog address?

    ReplyDelete
  8. Hi,

    Here's the blog. I downloaded the template again, but the alignment doesn't seem to be fixed, and the images aren't correct.

    Also, aren't the images supposed to be the entire size of the mini-tables, with a little bit of the post underneath? (As seen in the thumbnail image of Hell Biscuit?) In your demo, the images seem to be not centered at all, and there is no text underneath.

    Last but not least, is it possible to edit the code so the image links to the post, and not to the larger image in a new window? Viewers tend to click pictures, and I can see a lot of people not clicking the post.

    thanks for your help! This is a great design.

    ReplyDelete
  9. Hi Anonymous, well thanks for writing again but still you haven't provided your blog address. Anyways I'm updating the article for one of yoiur questions, for other thing read on...

    Images: The original wordpress template has images in the center and they become bigger when you open the post. That is because in wordpress you can differentiate between an image and the rest of the post but in Blogger a post means full post and there is absolutely no way to distinguish images and the text of post.

    That is why in Blogger the only way is to hide that part of image which is outside the post body (on main page) and when you open up the you see the full image.

    Believe me there is no technique so that you see a shorter image on the main page and larger on the post page. Image size never changes.

    I'll tell you in the article how to make pictures point to the post page...

    ReplyDelete
  10. Hi, sorry I thought I had posted the link.

    http://pinkdogbones.blogspot.com/

    Why do the images show up perfect on this blogger template? (Cellar Heat Light Gallery)

    http://cellarheatlightgallery.blogspot.com/

    ReplyDelete
  11. Thanks for the instructions on updating the links, but I meant changing the template coding so that each picture automatically points to the post it's in. I'd rather not have to edit each post.

    ReplyDelete
  12. Hi Anonymous sorry but I don't know and I don't think that we can make all images point to the post. You have to do that one by one. I'm afraid, you have to edit each post.

    ReplyDelete
  13. Hi Anonymous (http://pinkdogbones.blogspot.com/)

    Well, you told me about Cellar Heat Light, I downloaded that template and uploaded the very cute picture of a dog (from your blog). Guess what, even on that template the image is not centrally aligned, I have a screen shot for you to check out:

    http://4.bp.blogspot.com/_wa6zL1GRiOs/Sa6EJT4Sj_I/AAAAAAAACXw/8wHZXRSz7A0/s400/Picture999.JPG

    ReplyDelete
  14. I opened an another account with blogger just to test templates before changing my official blog...and i notice that if i post videos it shows up on the bottom of the page ( when you go to the site click to the older post and vids end up at the bottom stacking over each other)....how do i stop that from happening?

    http://beautifulstaryouare.blogspot.com

    ReplyDelete
  15. Hi mskakdjjriif:


    Search for this piece of code in your template HTML:


    #col01 .home-post .excerpt {color:#333333;
    height:190px;
    overflow:hidden;
    padding:12px 12px 0;
    font-size:11px;
    line-height:16px;
    background:#a7a7a7;
    }


    ---------------------------------------------

    Just change the

    overflow:hidden;

    to

    overflow:auto;

    ---------------------------------------------

    New code will look like:

    #col01 .home-post .excerpt {color:#333333;
    height:190px;
    overflow:auto;
    padding:12px 12px 0;
    font-size:11px;
    line-height:16px;
    background:#a7a7a7;
    }

    ReplyDelete
  16. Is it possible to show more posts. 8 seems to only take up a portion of the page and I would love to have 16 showing. Any help would be nice!

    ReplyDelete
  17. Hi Tammie King - Night Owl Romance, yes you can have as many number of posts as you like. To do this just go to

    "Settings" tab then "Formatting", there you can see the very first option. On that option you can set the number of posts you want to show on your main page.

    ReplyDelete
  18. Hi zEEROCKz,first of all thank you for your template, design is unique. I like it very much! Then I have a question: how can I change the pink colour of all buttons, for example, for blue colour? Pink is too hot for me:-). I hope you undestand my English for I am not a native speaker... Thank you very much!

    ReplyDelete
  19. This comment has been removed by the author.

    ReplyDelete
  20. Hi zEEROCKz you can solve problem with images adding properties max-width and max-height ☺☺☺

    ReplyDelete
  21. Hi Anonymous, thanks for appreciating!

    When I saw your question, I also changed my blog color combination, you can also do this. I've written a special tutorial for you, you just need to download the following text file!

    -------------------------------------------------------------
    http://versatilitylite.googlepages.com/ChangePinkColor.txt
    -------------------------------------------------------------

    ReplyDelete
  22. Hi Pizcos, thanks for giving me such a brilliant idea. Actually now I've added an img{} in the CSS and used your suggested tags in it. Now, everything is looking great!

    Thank you so much!

    ReplyDelete
  23. Thanks a lot for ChangePinkColor tutorial!

    ReplyDelete
  24. This comment has been removed by the author.

    ReplyDelete
  25. hi zEErockz,see the following blog.it uses cellar heat dark version. on that template the image is centrally aligned.i used the same temp but but cant do it on the same way.i hope it will help u to to understand.please give us a solution.thanx in advance.
    http://ecomicbook.blogspot.com/

    ReplyDelete
  26. Hi W. Bush, I've figured out that problem. So, if you download the template now, you'll see that all the images are in center. Please download the template again, I've updated the download links.

    ReplyDelete
  27. Hi, I was wondering what to change to turn this into a three column layout with wider post boxes for videos?

    ReplyDelete
  28. i find that if each of the post have tons of photo, when at the main page .. for example if i have about 12 post then the main page would load very slowly. Is there a way to just make the post at the main page load the partial portion of each post ?

    ReplyDelete
  29. Hi Lou G. sorry for replying so late. Actually to change this template into a 3 column layout you need to look into the CSS Styling of this template. Actually the "Excerpt" class is defining the post width(on main page). If you don't have any idea about CSS or you can't fix it yourself, then you can ask for my help....

    ReplyDelete
  30. Hi Uncleim, actually in Blogger platform, the posts (all post data) are wrapped in a single tag, so there's absolutely no way to change that tag. However, you can always optimize your images or reduce their resolution. Before uploading, I always go to

    http://tools.dynamicdrive.com/imageoptimizer/

    So, if you optimize your images from here, you'll see the clear difference. One more thing, when you apply any "Read More" hack, it doesn't short the post actually, although you don't see the remaining part but the full post always gets loaded, so try optimizing your images and use lesser images.

    ReplyDelete
  31. I was completely blown away, very nice designs.

    ReplyDelete
  32. Hi! great template bro... I have some questions:
    How To change the color of sidebar menu titles?
    When you bring your mouse over titles on the the text color and it's background color changes.

    ReplyDelete
  33. Great theme, Just installed it on my site, but none of the post preview thumbnails show :(

    http://www.geomixes.co.uk/

    ReplyDelete
  34. I just downloaded and used this template. When I click on the labels, it does not direct to the post but view only a "column" of the post as shown on the home page. Help! What should I do? I like this template and really don't wanna change to another one. Please do look at it at http://impressive-blogger.blogspot.com. Is it supposed to be that way?

    Another problem if you can help - i'm using Windows Live Writer to edit my blog. Don't have problems with previous template but having great problem with this one...this template is not working well with Windows Live Writer. To adjust, I have to do it at blogger.com BUT I received error when making changes to my blog at blogger.com.

    ReplyDelete
  35. forgot to add something in the previous comment.

    1) how can i display blogger's navigation bar? i find it more convenient to sign in from there.
    2) look at the adsense ad i put on top - it is covering part of my "labels". can i adjust the label to be a bit further to the right so that the ads are not blocking part of the "labels"?
    (http://impressive-blogger.blogspot.com)

    Thank you very much. Btw, maybe you should consider doing few more templates similar to this one. I like the idea that snippets of the posts in my blog are all tabled this way at homepage. :)

    ReplyDelete
  36. Hi blogtester, the labels problem is not a problem actually.... a single label may contain more than one posts so these are displayed in columns. if you want to link directly to the post page then you can create an "HTML/JavaScript" widget in the sidebar. in that widget you can create links which will point to the post page directly like this:


    <a href="Post URL Here">Post Title Here</a><br/>

    for example if I want to link to my Gumball Template page in a "HTML/JavaScript" gadget then I'll write this code:


    <a href="http://bloggerfaqs.blogspot.com/2009/02/gumball-special-blogger-template.html">Gumball Special Template</a><br/>


    Please note that the <br/> will ensure that there's only one link in a line.

    ReplyDelete
  37. Hi blogtester, I don't have any experience with Windows Live Writer so I'm afraid I can't help you in that...

    ReplyDelete
  38. Hi blogtester, to display Navbar, go to "Layout" and then in "Edit HTML" search for:

    .Navbar {visibility:hidden;display: none;}

    and remove this code. then preview changes and save.


    to completely display your top adsense ads, you need to find this code:

    #col01 {
    width:720px;
    float:left;
    overflow:hidden;
    }


    and change width:720px; to some higher value like width:740px; and then see the preview, if you're ok save.

    ReplyDelete
  39. bilal, thanks for your help! u r indeed right abt the labels thingy. as for Windows Live Writer - I'll just have to bear with it since I prefer this template among all others.

    Tried changing the width of col01 to 728px coz dats the width of the adsense ad but it pushed my col02 to bottom! seems like i don't have enough space to fit in col01 at 728px + col02 at 220px on same row...scratched my head at first and tried to figure out whether i can reposition col02 on the left instead - it worked out! (i'm a genius amongst javascript dummies! lol!) but it stick together with col01...

    thanks to your coaching though, i adjusted col02 to 200px. i'd rather have col02 smaller if that's the only way to fit it in. it is now something i want!! many thanks!

    ReplyDelete
  40. Hey blogtester, I'm happy you did what you want, feel free to connect in the future for any help or maybe a suggestion...

    ReplyDelete
  41. Great wirk.please explain the use of RAr files.

    ReplyDelete
  42. Hi hosting boy, actually .rar files are compressed archives in which I pack my templates. You can extract .rar and .zip files by downloading a free software "7-zip":

    http://www.7-zip.org/download.html

    make sure you download the .exe file.

    ReplyDelete
  43. Great work, but;
    How do you get rid of the "dig it submit" button?

    And Is there any way of getting the "standard"? blogarchive function to work?

    ReplyDelete
  44. ..and where do you change the posted page itself? Not the prewiews. I want to change ie the background to black. Thanx Pontus!

    ReplyDelete
  45. Hi Anonymous, can you please gimme your blog address, so that I can have a look at it and I'll be able to help you in a better way....

    ReplyDelete
  46. Hi Zeerockz/Bilal, kindly need your help. HOw to change the color background into another color?
    I've read the tutorial for anonymous. mAybe I really need is color codes eg for black, blue etc. I don't know the codes. But if You give me clues how to know the codes of many color, I can follow the tutorial and try to change the color of my new blog. Really need your guide. Regards n many thanks

    ReplyDelete
  47. http://gbggraffentertainment.blogspot.com/
    Here it is Bilal.

    ReplyDelete
  48. Hey bilal. anonymus here again. Made some pictures to explain my questions.

    http://i26.tinypic.com/kd0f1v.png
    http://i28.tinypic.com/ofajk1.png
    http://i31.tinypic.com/ouvcq9.png

    Thanx Bilal

    ReplyDelete
  49. @ Clement Yonathan, download ColorPic, it's free and easy. It can pick any color from your computer screen and give you the hex code for that color.

    http://www.iconico.com/colorpic/

    ReplyDelete
  50. @ anonymous, you've got a list of changes you want but don't worry I'm here to help.

    First of all backup your current layout before doing any change.

    To delete the Digg button (the annoying one), go to the Edit HTML section, check Expand Widget Templates and find and delete the following code:

    <span class='digg'>
    <script type='text/javascript'>
    digg_bgcolor = &#39;#ffffff&#39;;
    digg_skin = &#39;compact&#39;;
    </script>
    <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></span>


    and save your template and see the result.

    ReplyDelete
  51. @ anonymous, to raise sidebar to the level of post, find this code:

    #col02 {
    width:220px;
    float:right;
    overflow:hidden;
    }

    and add a margin property in it like this:

    #col02 {
    width:220px;
    float:right;
    overflow:hidden;
    margin-top:-10px;
    }

    Please note that the "margin-top" simply defines the margin or spacing from top, I've given it a negative (-10px) value because I intended to decrease the spacing from top. If you're not satisfied with the levels, just play a little bit with the [-10px] value and Preview the changes to see the results, when satisfied, simply SAVE.

    ReplyDelete
  52. for spacing problem on hover, you need to add a labels widget because I just did an experiment with the labels widget. Just try the following method, if it'll make you happy then I'll tell you the code to apply it on the whole sidebar.

    find this code:

    #col02 li a {
    display:block;
    color:#fff;
    text-transform:uppercase;
    font-size:11px;
    padding:5px 0;
    text-decoration:none;
    }
    #col02 li a:hover {
    color:#000;
    text-decoration:none;
    background:url(http://i386.photobucket.com/albums/oo302/levisinside/Gumball%20Special/bullet.gif) no-repeat 5px 50% #ff0067;
    text-indent:16px;
    }


    and replace the whole of above code with the following code:


    #col02 li a {
    display:block;
    color:#fff;
    text-transform:uppercase;
    font-size:11px;
    padding:5px 0;
    text-decoration:none;
    }
    #col02 li a:hover {
    display:block;
    font-size:11px;
    text-transform:uppercase;
    color:#000;
    padding:5px 0;
    text-decoration:none;
    background:#ff0067;
    }


    save and see the results.

    ReplyDelete
  53. @ anonymous, you've still one problem pending, you asked to change the title of post to look like that of sidebar headings. That requires a detailed look, gimme some time, I'll comment here soon!

    ReplyDelete
  54. Thank you Bilal for taking your time!
    I've totaly missed the "Expand Widget Templates" Option. Mabybe i could have figured that one with the "digg it" out by my self.

    Thanx for the helt po raise the sidbar, perfect.

    I could not get the spacing on hover problem out of the way though. I tried to replace the code as you described, but it still was spacing (with the standard colour though)
    Was i supposed to add widgets? If so I dont exactly know what that is.

    Thanx Again, Pontus

    ReplyDelete
  55. @ Anonymous, I'm happy to help you. For the spacing problem, I told you that you have to add a labels widget because I did the experiment with that widget. To add labels widget, go to Layout -> Page Elements -> Click Add a Gadget link in your sidebar -> Add a Labels gadget and see your blog for the changes.

    ReplyDelete
  56. Hi ,
    dear i have a blog at blogger.com , and i put this wonderful theme . but i face a problem . would you tell me how i can place two or more posts in one cell , means one page with two or more titles , i know about this code ( rore ) (readmore appears) but i want many post in one cell which define in this templete. and i have not able to make categories in it , i want to make 4 different categories in my blog , and each category will have different labels(blog archives),dear o am waiting for you reply hope you will give me better response ,
    regards

    ReplyDelete
  57. @ WebMaster, please gimme a screen shot of what changes you want to apply, currently, I can't understand what you're talking about!

    ReplyDelete
  58. hello Bilal
    how are you, hope you are alright. so Bilal dear i am using "shemer max template" and i want to edit its logo text (at the top of the theme) and i followed all the steps which you have describe for this template but i still fail to get my needs , so dear now i am contacting with you and i hope you will reply me at soon .
    with best regards

    ReplyDelete
  59. @ WebMaster, I've not converted the template you're talking about. So, it would be easier to help if you could provide me the address from where you've downloaded that template!

    ReplyDelete
  60. very very thanks for reply , thats a address "http://www.bloggertricks.com/2009/03/one-more-magazine-style-blogger.html" which i download ,

    ReplyDelete
  61. @ WebMaster, please contact the owner of BloggerTricks, I'm sure he'll help you.

    ReplyDelete
  62. Hey guys! This template is awesome!
    I designed my own header to put up in Blogger, but for some reason I can't get rid of the gray design on top! Here's a link to my blog so you guys can understand better. http://gloriasnyc.blogspot.com/

    Any ideas on how to get rid of the gray thing and just have my header? Thanks a lot!

    ReplyDelete
  63. @ G¡Lor¡a, to remove the gray thing, go to "Edit HTML" then find and delete the following line.

    http://i386.photobucket.com/albums/oo302/levisinside/Gumball%20Special/scroll.gif

    I've also noticed that you've been posting videos in the posts. Please note that there's an official bug in Adobe Flash Player due to which it doesn't support the CSS "Overflow:auto;" property. Any flash videos will be displayed also on the main page which are supposed to be hidden on the main page so please don't embed any flash videos in your posts.

    ReplyDelete
  64. @Bilal, Thank you so much!!! It worked perfect! :D
    As for the videos, I embedded the player from Vimeo and I checked it and it's working, and I can't see it on the homepage.

    ReplyDelete
  65. This is my blog http://sanskarbharatirangoli.blogspot.com/
    The images in my blog seem not to fit into the first page, they are big and only a portion is visible. How can I fix it. Please help

    ReplyDelete
  66. @ Vani Muthukrishnan, you're using "Cellar Heat Template" which is not converted by me, so I'd recommend you to contact the original author here:

    http://www.magznetwork.com/

    ReplyDelete
  67. hi,
    i like ur template....thanks!

    1)how can i change the pink colour?

    2) how can i fit the pic centrally aligned, it is now distorted. And for videos too.

    Thanks!

    ReplyDelete
  68. @ Jia, here are the answers.

    1- To change the pink color behind the post titles, find this code:

    #col01 .home-post .title {
    background:#ff0067;
    padding:4px 8px;
    }

    and then replace the value ff0067 which is the hex code of pink color. You can simply go to colorlovers.com and find a lot of colors with their hex codes.

    To change the color behind sidebar titles, find this code:

    #col02 h2 {
    background:#ff0067;
    padding:4px 8px;
    color:#fff;
    font-size:12px;
    font-weight:bold;
    text-transform:uppercase;
    }

    Again, you just have to change the value "ff0067" with the hex value of some other color.


    2- I just saw your blog and I think images are already centered. However, the videos are all over the place, this is because these videos are powered by Adobe Flash and it is an official bug in Flash which can't hide it using a CSS property which is used in this template.

    ReplyDelete
  69. hey.
    can i make a photo (jpeg) as the background? how do i do that?

    ReplyDelete
  70. @ ixSevenEightNine, see this post:

    http://bloggerfaqs.blogspot.com/2009/06/how-add-picture-image-background.html

    ReplyDelete
  71. Hi there,
    I love this template but have a few problems/ things I want to change I hope you can help with. I've read all of the previous tips you've given and would download the updated template to try to fix these things but it is not currently available.
    1. Images: I can't get the images to appear the right size in the small tile on the home page.
    Here's my blog address: http://www.loveislovesydney.com/
    2. How do I get the blog description to wrap so it's not over the top of the swirly pattern?
    3. How do I place other links on the "Edit" links on the bottom sidebar menu?
    4. Why don't any colors appear in the standard fonts & colors menu? I know I can change these all in the HTML code but it would be much easier the other way.
    5. In the About Me box the alignment is all wrong. How can I fix these?
    Thanks so much for any help you can give.
    Gabrielle

    ReplyDelete
  72. @ Gabrielle Shone, this is exactly the reason for which this template is no longer available. My first advice would be to use some other template or hire some Blogger expert to create a new design for you. Currently, I can fix all the problems except the no. 1, so if you really need this template, tell me.

    ReplyDelete
  73. Hello
    sorry
    My English is not good

    Ask a question

    old
    http://img839.imageshack.us/img839/7991/61004798.jpg

    new
    http://img269.imageshack.us/img269/4899/31589767.jpg

    height

    How changes to

    old
    http://img811.imageshack.us/img811/914/57158571.jpg

    new
    http://img713.imageshack.us/img713/5821/91033991.jpg

    I modify the height =300
    Or fail

    ReplyDelete
  74. @ javchinese subtitles, sorry but the support for this template is no longer available.

    ReplyDelete

Copyright@2014 : All Rights Reserved
Powered by: Blogger