SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Enthusiast tanjilovi's Avatar
    Join Date
    Mar 2012
    Location
    Dhaka, Bangladesh.
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to change BlogSpot templates widget width

    I want to know how to increase the widget box width by editing the template. I know that blogspot templates are based on HTML. I have some blogspot blogs. And I use Adsense in them. Suppose I want to use Google's 300 x 600 ads in my blog in the right side widget but the widget width size is 280px then it looks bad. You will find in my signature that I am suffering from that problem with my fitness blog. Please reply if you know how to change the html code to increase the widget size of widget / gadget.
    For Technology and entertainment Rock Music Box
    For Health and Beauty

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,219
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    In your source code, there's a script just above the widget like this:

    Code:
    <script type="text/javascript"><!--
    google_ad_client = "ca-pub-9807657484816343";
    google_ad_host = "pub-1556223355139109";
    /* Fitness tricks 4 all large sky scrapper */
    google_ad_slot = "1782893650";
    google_ad_width = 300;
    google_ad_height = 600;
    //-->
    </script>
    Try changing 300 to 222.

  3. #3
    SitePoint Enthusiast tanjilovi's Avatar
    Join Date
    Mar 2012
    Location
    Dhaka, Bangladesh.
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    In your source code, there's a script just above the widget like this:

    Code:
    <script type="text/javascript"><!--
    google_ad_client = "ca-pub-9807657484816343";
    google_ad_host = "pub-1556223355139109";
    /* Fitness tricks 4 all large sky scrapper */
    google_ad_slot = "1782893650";
    google_ad_width = 300;
    google_ad_height = 600;
    //-->
    </script>
    Try changing 300 to 222.
    Does it goes with Google's Terms and conditions ? I know that changing the ad width will do but I don't want that . I want some codes to increase the template's widget width. Thanks
    For Technology and entertainment Rock Music Box
    For Health and Beauty

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,219
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by tanjilovi View Post
    I want some codes to increase the template's widget width.
    In that case, you need to make some decisions about your page layout. For example, do you want to make the wrapper wider to accommodate the wider sidebar, or perhaps reduce the width of the cotent area and widen the sidebar?

  5. #5
    SitePoint Enthusiast tanjilovi's Avatar
    Join Date
    Mar 2012
    Location
    Dhaka, Bangladesh.
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    In that case, you need to make some decisions about your page layout. For example, do you want to make the wrapper wider to accommodate the wider sidebar, or perhaps reduce the width of the cotent area and widen the sidebar?
    I want to widen the wrapper to accommodate the bigger sidebar. Any suggestions ? Thanks.
    For Technology and entertainment Rock Music Box
    For Health and Beauty

  6. #6
    Non-Member
    Join Date
    Dec 2012
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Normally we can only maximize blogger width 1000Px, and side bar width only 500px. However using simple HTML hack we can maximize your blogger width more than 1000px and 500px.


    How to maximize blogger width more-than its default width.


    1: Go to blogger "Dashboard" >"Design"
    2: Then go to "Edit HTML" and check "Expand Widget Templates".
    3: Then click your keyboard "Ctrl" key with "F" key.
    4: Now search"<b:template-skin>" value.
    Last edited by spikeZ; Dec 25, 2012 at 02:26. Reason: fake sig removed

  7. #7
    SitePoint Enthusiast tanjilovi's Avatar
    Join Date
    Mar 2012
    Location
    Dhaka, Bangladesh.
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by amyjohn View Post
    Normally we can only maximize blogger width 1000Px, and side bar width only 500px. However using simple HTML hack we can maximize your blogger width more than 1000px and 500px.


    How to maximize blogger width more-than its default width.


    1: Go to blogger "Dashboard" >"Design"
    2: Then go to "Edit HTML" and check "Expand Widget Templates".
    3: Then click your keyboard "Ctrl" key with "F" key.
    4: Now search"<b:template-skin>" value.


    I didn't find any <b:template-skin> in my blogger template. other techniques ? :/
    For Technology and entertainment Rock Music Box
    For Health and Beauty

  8. #8
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,219
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by tanjilovi View Post
    other techniques ? :/
    Do you have easy access to your CSS file(s)? If so, this is easy to do. For example, you can play around with the width of the widgets here (around line 206 in the head of your page):

    Code:
    #sidebar-wrapper .widget {
    background: #EFEDD9 url(http://1.bp.blogspot.com/_8Frexm8Y9LQ/TDkWiSOcUzI/AAAAAAAAAU0/McU9VgkNl1w/s1600/side-widget-b.jpg) no-repeat left bottom;
    width: 252px;
    padding-bottom: 50px;
    }

  9. #9
    SitePoint Enthusiast tanjilovi's Avatar
    Join Date
    Mar 2012
    Location
    Dhaka, Bangladesh.
    Posts
    36
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Do you have easy access to your CSS file(s)? If so, this is easy to do. For example, you can play around with the width of the widgets here (around line 206 in the head of your page):

    Code:
    #sidebar-wrapper .widget {
    background: #EFEDD9 url(http://1.bp.blogspot.com/_8Frexm8Y9LQ/TDkWiSOcUzI/AAAAAAAAAU0/McU9VgkNl1w/s1600/side-widget-b.jpg) no-repeat left bottom;
    width: 252px;
    padding-bottom: 50px;
    }
    Thanks man for your reply. But my problem is solved. The template I am using has some limitations so I had to make some adjustments. I had to increase the widget size and also had to decrease the main content size. But now it's okay. Thank you for reply. The thread can be closed now , I think.
    For Technology and entertainment Rock Music Box
    For Health and Beauty

  10. #10
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,219
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Great! Glad you found a solution.

  11. #11
    SitePoint Member adammbsmith's Avatar
    Join Date
    Jan 2013
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I thought you could drag the sidebars and header wraps in the dynamic view of Blogspot?
    You simply drag how big/small you want it to be and then hit SAVE

  12. #12
    SitePoint Member
    Join Date
    Mar 2013
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thanks for the tips.

    Quote Originally Posted by ralph.m View Post
    Great! Glad you found a solution.
    Hi,
    Thanks a lot for the tips. It helped me to design my site <snip> a lot.

    Wish you all the best.
    Last edited by Dark Tranquility; Mar 6, 2013 at 04:06. Reason: Removed link


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •