WordPress.org

Ready to get started?Download WordPress

Forums

Picture in footer of twenty eleven (23 posts)

  1. Bellaris
    Member
    Posted 2 years ago #

    Can anyone tell me how to replace the existing footer in the Twenty Eleven with a picture?

    I want to add an image ranging 1000 px horizontally.

    Thanks a lot. :)

  2. esmi
    Forum Moderator
    Posted 2 years ago #

    Do not edit the Twenty Eleven theme. It is the default WordPress theme and having access to an unedited version of the theme is vital when dealing with a range of site issues. First create a child theme for your changes.

  3. Bellaris
    Member
    Posted 2 years ago #

    Oh yes. I forgot to write. I've established the child theme. :)

  4. esmi
    Forum Moderator
    Posted 2 years ago #

    You should be able to add the image via your child theme's CSS.

  5. Bellaris
    Member
    Posted 2 years ago #

    Yes, I know. I was hoping for some codes. I've Google it, but no luck.

  6. Bellaris
    Member
    Posted 2 years ago #

    PS! Quite new at this.

  7. Bellaris
    Member
    Posted 2 years ago #

    Please: What am I doing wrong here?

    </div><!-- #main -->
    
    	<footer id="colophon" role="contentinfo">
    
    			<?php
    				/* A sidebar in the footer? Yep. You can can customize
    				 * your footer with three columns of widgets.
    				 */
    				if ( ! is_404() )
    					get_sidebar( 'footer' );
    			?>
    
    			<img src="../images/Footer_MCK.png" alt="Footer_MCK" width="1000" height="266">
    
    <?php wp_footer(); ?>
    
    </body>
    </html>

    [Moderator Note: Please post code or markup snippets between backticks or use the code button.]

  8. alchymyth
    Forum Moderator
    Posted 2 years ago #

    without seeing the result, i guess you don't see an image, which might be cause by the relative path to the image.

    try to use an absolute path to the image:

    <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/Footer_MCK.png" alt="Footer_MCK" width="1000" height="266">

    http://codex.wordpress.org/Function_Reference/get_stylesheet_directory_uri

  9. Bellaris
    Member
    Posted 2 years ago #

    Thanks.
    You can see the result here MCK

  10. alchymyth
    Forum Moderator
    Posted 2 years ago #

    to make the image responsive, i.e. shrink with the browser window, add this to style.css of the child theme:

    #colophon img { max-width: 100%; height:auto; }

  11. Bellaris
    Member
    Posted 2 years ago #

    Thanks a lot :-)

  12. rook
    Member
    Posted 1 year ago #

    Hello sorry if im missing something here, but I put that absolute path into my footer and the image is showing up as a broken link and is in the wrong place??

    here is a link to the site: http://harrybuild.rookandamosdesign.co.uk/

    cheers

    Harry

  13. alchymyth
    Forum Moderator
    Posted 1 year ago #

    I put that absolute path into my footer

    what exactly did you add into the footer?

    where is the image located?

    what I see in your footer as image url does not make any sense.

    the earlier suggested code only works if the image is located in the /images folder of the theme.

  14. rook
    Member
    Posted 1 year ago #

    Right thats silly of me, I jsut uploaded the image to my wordpress library, instead of the theme. Should I just make a folder in my child theme called images? then use your code? The reason my url is all messed up is because I went onto my server with tso host and took the path from there to try that out(as you can see did'nt work)

    nice one

  15. alchymyth
    Forum Moderator
    Posted 1 year ago #

    no need to create a folder and relocate the image - you can point directly to the upload folder;

    example:

    <img src="<?php echo content_url(); ?>/uploads/2012/10/footer.jpg" alt="footer logo" width="801" height="81">

    http://codex.wordpress.org/Function_Reference/content_url

  16. bren5366
    Member
    Posted 1 year ago #

    Hello, I am new to Word Press and I am having trouble uploading an image to my footer. The image appears in my footer when I open the website on Internet Explorer, yet it does not appear when I open the website on Firefox of Chrome.

    Does anyone know why this is? Here is my coding that I put in, under Appearance, Editor, Footer.

    <p align="center"> <img alt="" height="200" src="file:///C:/Users/brenda/Downloads/logo%20websites.png" width="225" /></p>

    I find it strange that it works on Explorer, yet not Firefox and Chrome.

  17. bren5366
    Member
    Posted 1 year ago #

    I am also using the theme The Me Magic Pro

  18. cartwrightk
    Member
    Posted 1 year ago #

    Hello out there,
    could someone please tell me the code to putting an image as a background in a footer in the style sheet of my child theme?

    I have been working on this for days to no avail :(

  19. cartwrightk
    Member
    Posted 1 year ago #

  20. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    @cartwrightk - someone can help you with it, but it's best to start a new thread per http://codex.wordpress.org/Forum_Welcome#Where_To_Post

  21. cartwrightk
    Member
    Posted 1 year ago #

    sometimes i get lost on this site - where do i go to start a new thread?

  22. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    No problem - at the top of each forum there's an "Add New" button which takes you here :)

    http://wordpress.org/support/forum/themes-and-templates#postform

  23. cartwrightk
    Member
    Posted 1 year ago #

    okay, thank you very much, i have done it :)

Topic Closed

This topic has been closed to new replies.

About this Topic