Oxygen theme missing options?
-
There is no “home” choice under templates in the Oxygen them and the “Location” box is missing. I’ve tried in the free and Premium versions. Please help. I like the theme but want custom page headers.
The blog I need help with is: (visible only to logged in users)
-
Hi there,
There is no “home” choice under templates in the Oxygen them
I’m not sure what you mean by this. Take a look at the theme’s support page and let me know what you mean:
https://wordpress.com/themes/oxygen/
As for the Location field, you can add your location to any post through the Add Location button as seen here:
I like the theme but want custom page headers.
Are you looking to have a different header on each page? You can do this if you edit CSS. You will need to get the page ID in order to change the image for each header. For example,
I went to your Trademarking page and right clicked on the page. Then go to Inspect Element and you will see the Page ID:
As seen the Page ID is 55: .page-id-55. Then, get the image you want to use for the header. I found an image for Trademarking in your Media > Library:
Once you have both of that, please go to Appearance > Customize > CSS in your Dashboard and add this:
.page-id-55 img.custom-header { content: url(http://reidco14.files.wordpress.com/2014/08/trademark-feature.jpg); }As seen you have the page ID and the URL for the image.
In order to change the page headers for the other pages, just switch out the page ID and add the image URL. The template for this can be seen here:
.page-id-XX img.custom-header { content: url(IMAGE URL); }If this is a bit confusing, just upload the header images you want for each page and I can change this for you.
Let me know if you have any questions with this!
-
Hi, thanks for that.
Have pasted .page-id-55…content url(… in as you suggested and instructions seemed straightforward but nothing happened to the page.
?? -
Hi Again. Re. problem above,
I’ve worked out that in Firefox there has been no response to the css code I put in (test banner was a plain red bar ‘http://reidco14.files.wordpress.com/2014/08/test.jpg’).
These other two browsers show the red bar on the trademark page but not Media or Graphic Design pages.
Google Chrome
Safari
This is beyond me and very frustrating. Heeeelp! Pleeease! -
These other two browsers show the red bar on the trademark page but not Media or Graphic Design pages
You would need the page id’s for the other pages. Currently the .page-id-55 is only the Trademark page.
I provided you instructions to find the page id’s of the other pages. Let me know if you still can’t find it.
-
Headers are all updated and good thanks.
I’ve worked out the problem.
I’ve been using Firefox and updated page banners don’t show up.
Google Chrome and Safari are working well.
So why won’t Firefox respond to changes? -
From some investigation, it appears as though Firefox doesn’t respond to content: url CSS unless it includes a before or after element:
http://stackoverflow.com/questions/17907833/content-url-does-not-display-image-on-firefox-browser
Can you try the following?
.page-id-158 img.custom-header:before { content: url('http://reidco14.files.wordpress.com/2014/09/media-banner.jpg'); } -
-
Hi there,
So there’s another way to do this, but you’ll need a bit more CSS. When we use content (Chrome) you won’t need to set a width/height. However, as you saw Firefox/IE didn’t respond to it. Another way would be to set the background URL, but then media queries will be needed so that the header will not break on mobile and tablet devices. So for each one you will have to add this:
.page-id-55 img.custom-header { display: block; -moz-box-sizing: border-box; box-sizing: border-box; background: url('//reidco14.files.wordpress.com/2014/09/trademark-banner.jpg') no-repeat; width: 940px; height: 150px; padding-left: 940px; /* Make sure this is equal to width of new image */ } @media screen and (min-width : 768px){ .page-id-55 img.custom-header { display: block; -moz-box-sizing: border-box; box-sizing: border-box; background: url('//reidco14.files.wordpress.com/2014/09/trademark-banner.jpg') no-repeat; width: 728px; /* Keep this width for tablets */ height: 116px; padding-left: 728px; /* Make sure this is equal to width of new image */ } } @media screen and (max-width : 480px){ .page-id-55 img.custom-header { display: block; -moz-box-sizing: border-box; box-sizing: border-box; background: url('//reidco14.files.wordpress.com/2014/09/trademark-banner.jpg') no-repeat; width: 315px; /* Keep this width for mobile */ height: 50px; padding-left: 315px; /* Make sure this is equal to width of new image */ } }That will change the header image for page 55 on desktop, mobile, and tablet devices. If you do this for the other pages as well you will get what you want. Let me know if you have any questions about this!
-
Great. It worked. Only problem is the banner width for full screen is cropped and different width to the home page. Same for tablet version. The mobile version is very cropped but I can live with that.
-
-
Is there no way to have the banners at 940 x 150px as per home page? Banner images for graphic design, trademarking and media have resized, not cropped.
See:
http://reidcocreative.com
http://reidcocreative.com/trademarking/I resized images for tablet and mobile and uploaded them. Looks better.
-
-
The home page header was wider than the following 3 pages, which looked awkward and unprofessional. I give up trying to have custom headers in Oxygen as it’s obviously not possible. I now have the same header on every page. Thanks for trying.
- The topic ‘Oxygen theme missing options?’ is closed to new replies.
WordPress.com Forums 