How to twentytwelve wide frontpage image?

  • Resolved Kaplaink

    (@kaplaink)


    11 years, 4 months ago

    Hey guys

    Maybe my search terminology is not correct but I can’t find threads explaining how I can widen the frontpage main image to go all the way across the widget area i.e. pushing the widget area down to start below the image (almost like the twenty eleven).

    My only silly attempt has been to increase the width of the image but it remains with the same fixed width (and the side widget remains to the left of it.

    This also highlights my current skills in WP ?

    Thanks in advance!

Viewing 8 replies - 1 through 8 (of 8 total)

  • You would need make a child theme and then make modifications to one or more theme files – not sure where you want this image to be. Do you mean the featured image? Or header image?

    In any case, start with:

    https://codex.www.ads-software.com/Child_Themes

    Thread Starter Kaplaink

    (@kaplaink)

    (I’m so happy someone replied!)

    I have already created a twenty twelve child theme folder that works.

    What I wish to achieve is this: https://inspiredm.com/wp-content/uploads/2013/02/2-Header-Image.jpg
    I.e. widen the main image on my home page > and have the text area and side widget start immediately below.

    This is my page, where the image is not able to expand across as it’s “blocked” by the side widget https://www.wuyesouxunzhe.com/

    The auto size is 960×250 px but as I see that you have to make changes in styling with CSS . You have to change the padding or margins of the “header-image” class to fit the header.

    Thread Starter Kaplaink

    (@kaplaink)

    sorry to be thick-headed but can you advice in a bit more details (please)?

    Do you know where exactly it is I need to change it?

    Also what about widget are, don’t I need to specify that this area should be “moved down”?

    Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

    Thread Starter Kaplaink

    (@kaplaink)

    Dammit ?? I thought this would be a simple change of some dimension in a couple of templates, as I see quite a few twenty twelve sites using this full width image and with text and widget below

    Thread Starter Kaplaink

    (@kaplaink)

    I’m struggling guys! please help ??

    I have installed firrbug and when hovering over the sidebar area I can see it belongs to the secondary widgit (last line) in below html.

    My question is, where do I find this in my php files and what should I amend to actually move it down?

    <body class="home page page-id-346 page-template-default custom-background styles custom-font-enabled single-author">
<iframe id="WEIBO_STK_LOGIN_IFRAME" name="WEIBO_STK_LOGIN_IFRAME" src="https://widget.weibo.com/public/login_Proxy.html" style="display: none;">
<div style="position: absolute;">
<iframe id="sina_anywhere_iframe" style="display: none;">
<div id="_GPL_e6a00_parent_div" style="position: absolute; top: 0px; left: 0px; width: 1px; height: 1px; z-index: 2147483647;">
<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
<div id="main" class="wrapper">
<div id="primary" class="site-content">
<div id="secondary" class="widget-area" role="complementary">

    [Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

    Thread Starter Kaplaink

    (@kaplaink)

    Sorry I was stupid. I just had to insert a header image. That did the job, lol.

    I thought the header image was going to be inserted above the menus and not below.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How to twentytwelve wide frontpage image?’ is closed to new replies.