WordPress.org

Ready to get started?Download WordPress

Forums

Patchwork
Possible to change the patchwork background? (37 posts)

  1. loveateverybite
    Member
    Posted 2 years ago #

    Hello, Is it possible to customize the patchwork background ?

    My website is..http://loveateverybite.com/

    http://wordpress.org/extend/themes/patchwork/

  2. Shail
    Member
    Posted 2 years ago #

    yes.
    where you want to change background ?

  3. loveateverybite
    Member
    Posted 2 years ago #

    i would like to change the header background..the patchwork design to something of my own ..! how to?

  4. Shail
    Member
    Posted 2 years ago #

    in your style.css on line:1151 below style is coded.

    .style-babycakes #masthead {
        background-image: url("images/patchwork3.jpg");
        border-bottom: 10px solid #774F47;
    }

    here you can change background-image property with your own.
    You can change image as you required.

  5. loveateverybite
    Member
    Posted 2 years ago #

    i've found that line ..what do i have to replace?

  6. Shail
    Member
    Posted 2 years ago #

    Are you want to set another image or want to set background color???

  7. loveateverybite
    Member
    Posted 2 years ago #

    another image :)

  8. Puneet Sahalot
    Member
    Posted 2 years ago #

    You can replace your existing code

    .style-babycakes #masthead {
        background-image: url("images/patchwork3.jpg");
        border-bottom: 10px solid #774F47;
    }

    with

    .style-babycakes #masthead {
        background-image: url("URL_TO_YOUR_NEW_BACKGROUND_IMAGE");
        border-bottom: 10px solid #774F47;
    }

    or if you want to use a solid color as background, you can replace your existing code with

    .style-babycakes #masthead {
        background-image: none;
        background-color: HEX_COLOR_CODE;
        border-bottom: 10px solid #774F47;
    }
  9. radhika
    Member
    Posted 2 years ago #

    hii
    search /* .style-maude #masthead */ in style.css template and change background-image property with your own.

    .style-maude #masthead {
    background-image:url(images/patchwork.jpg);
    border-bottom: 10px solid #46433a;
    }

  10. Shail
    Member
    Posted 2 years ago #

    first paste image in your
    "wp-content/themes/patchwork/images/" directory.

    than set

    background-image: url("images/here-your-image-name");

    image name in this property.
    Make sure that your image name have no space...

  11. loveateverybite
    Member
    Posted 2 years ago #

    i replaced it with this direct link but nothing is happening :(

    http://i1214.photobucket.com/albums/cc494/giuliap90/back.png

  12. loveateverybite
    Member
    Posted 2 years ago #

    sorry ...how do i paste my image in to "wp-content/themes/patchwork/images/" directory. ??

  13. loveateverybite
    Member
    Posted 2 years ago #

    sorry ...how do i paste my image in to "wp-content/themes/patchwork/images/" directory. ??

  14. radhika
    Member
    Posted 2 years ago #

    hey save your image in 'wp-content> theme >patchwork> images folder '.

  15. Shail
    Member
    Posted 2 years ago #

    style-babycakes #masthead {
        background: url("http://i1214.photobucket.com/albums/cc494/giuliap90/back.png") !important;
    }

    paste this at bottom of your style.css

  16. loveateverybite
    Member
    Posted 2 years ago #

    sorry Shail ... how can i paste my image in to "wp-content/themes/patchwork/images/" directory ?

  17. Shail
    Member
    Posted 2 years ago #

    you can download image from http://i1214.photobucket.com/albums/cc494/giuliap90/back.png on your local computer and just copy and paste in your dir.

  18. loveateverybite
    Member
    Posted 2 years ago #

    sorry i'm still struggling to understand ..i have the image on my desktop...how do i copy it into directory?

  19. Shail
    Member
    Posted 2 years ago #

    Are you working on live project or on localhost...?

  20. loveateverybite
    Member
    Posted 2 years ago #

    i'm not sure what that means ..

  21. Shail
    Member
    Posted 2 years ago #

    And if you find out your style.css than images dir is in the same dir as style.css dir so open images dir and paste your image.

  22. Shail
    Member
    Posted 2 years ago #

    style-babycakes #masthead {
        background: url("http://i1214.photobucket.com/albums/cc494/giuliap90/back.png") !important;
    }

    you can directly use this. No required to paste image.

  23. radhika
    Member
    Posted 2 years ago #

    @loveateverybite
    Firstly copy your image from the desktop. And open your theme folder, goes into patchwork folder, open images folder and paste the image in images folder.

    .style-maude #masthead {
    background-image:url(images/image.jpg);
    border-bottom: 10px solid #46433a;
    }
  24. loveateverybite
    Member
    Posted 2 years ago #

    @Shail i've tried ...its not working ...

    @arti singh .. where is the theme folder?

    sorry guys you are talking with some1 with no experience!

  25. radhika
    Member
    Posted 2 years ago #

    where you upload the files of your theme on your server.

  26. loveateverybite
    Member
    Posted 2 years ago #

    @arti singh - what folder?

  27. Puneet Sahalot
    Member
    Posted 2 years ago #

    Here is the simple way. You can use the image even if you don't put it into "images" folder.

    Do this:
    Download the image on your computer from http://i1214.photobucket.com/albums/cc494/giuliap90/back.png

    Now login to WordPress admin
    Go to Media Library >> Add New
    Upload your downloaded image here.
    After the image is uploaded to your site, you will see a URL for the uploaded image.
    Copy that URL

    Edit the style.css file
    and replace your old code with :
    background-image : url("YOUR_FILE_URL_HERE") !important;}
    if you don't see any changes on the site. Try clearing the browser cache.

  28. loveateverybite
    Member
    Posted 2 years ago #

    i actually did manage to put it into the image folder .. and reinstalled the theme ...but nothing was woriking :) i'll try it your way!

  29. Puneet Sahalot
    Member
    Posted 2 years ago #

    ah! you don't need to re-install the theme.
    That will over-write the changes you make to the default code.

    Now that you have uploaded the theme, login to WP admin
    Go to Appearance >> Editor >> Style.css

    and then follow the instructions from my last message for uploading the image and getting the URL.

  30. Puneet Sahalot
    Member
    Posted 2 years ago #

    Well, I just had a look at the theme and you don't need to do all this CSS stuff.
    It supports custom background.
    Here, is the easiest way :
    Login to WP admin
    Go to appearance >> background
    Upload your new background image and "save"
    That's it!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags