Adding a custom logo and background

Homepage › Community Forums › Skope Theme Support › Adding a custom logo and background

Tagged: ,

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • April 23, 2013 at 5:29 pm #4138
    April 24, 2013 at 1:25 am #4153
    Wes
    Moderator

      Take a look in your functions.php file first, and replace the header size with the exact size of your image. Then it will upload without the need to crop.

      April 24, 2013 at 6:27 am #4158
      kurdi
      Customer

        Wes. Thanks for your input, I was able me get the image uploaded as is without cropping.

        However, the custom background image that I am using is covering the logo. Here’s what I am using in my custom css file. I am hoping you can figure out a solution.

        ** note that I made a mistake and copy/pasted the wrong CSS in my original message above.

        #header { background: url(/images/backimage.png)!important;
        }

        April 24, 2013 at 2:56 pm #4178
        Wes
        Moderator

          Do you have a link so I can look at both the site with the code together live? I would need to see a live link because the code itself won’t be enough to detect what the issue is.

          Thanks

          April 24, 2013 at 3:05 pm #4182
          kurdi
          Customer

            You can see my dev site here http://bit.ly/ZLZaDt, with the background covering the logo.

            April 24, 2013 at 4:02 pm #4195
            Wes
            Moderator

              Actually you have your #header set to show both images at the same time in your css. Only one image can be shown from the same ID at a time in css. As you can see, its choosing the image that you want as your background. What you should do instead is apply the background graphic to #head-wrap in your css file…..then leave the logo background where it is (on the #header). This will allow you to have the #head-wrap in the background showing the dark background image, and the #header displaying the logo background image on top.

              You’ll probably need to make some adjustments once you do this, since the #head-wrap wraps around the header and the navigation. There are a couple ways to fix this, but I’ll wait until you do the first part first and we’ll move on from there.

              April 25, 2013 at 1:25 am #4240
              kurdi
              Customer

                removed the background from #header and added it to #head-wrap.

                #head-wrap  {background: url(/images/escheresque_ste_@2X.png)!important;}

                It doesn’t seem to work

                April 25, 2013 at 5:14 am #4243
                kurdi
                Customer

                  Sorry I take that back. It did work but as you said it now displays the background underneath the navigation. How to fix that?

                  Thanks.

                  April 25, 2013 at 8:28 am #4247
                  kurdi
                  Customer

                    OK, I went in and styled the #Nav div and was able to get it to look right.

                    Although it does seem an inelegant solution, and that the Nav belongs outside of the #head-wrap. 🙂

                    April 25, 2013 at 1:47 pm #4258
                    Wes
                    Moderator

                      Take a look in your functions.php file and look for this –

                      `/** After Header Wrap */
                      add_action(‘genesis_after_header’, ‘before_after_wrap’);
                      function before_after_wrap() {
                      echo ‘‘;
                      }`

                      Then change that to this –

                      `/** After Header Wrap */
                      add_action(‘genesis_after_header’, ‘before_after_wrap’, 1);
                      function before_after_wrap() {
                      echo ‘‘;
                      }`

                      The difference is a “priority” added which moves the `` up above the nav. In some cases people want the header and nav together…..but in this case, for what you’re doing its best to separate the two.

                      April 25, 2013 at 3:20 pm #4276
                      kurdi
                      Customer

                        Thanks,

                        I don’t like to change theme files, in anticipation of the Skope update.

                        But I was able to do it using the following in the custom functions file

                         

                        remove_action(‘genesis_after_header’, ‘before_after_wrap’);

                        add_action(‘genesis_after_header’, ‘before_after_wrap’,1);

                        April 25, 2013 at 11:41 pm #4284
                        Wes
                        Moderator

                          You’re Welcome

                        • Author
                          Posts
                        Viewing 12 posts - 1 through 12 (of 12 total)
                        • The topic ‘Adding a custom logo and background’ is closed to new replies.