Many WordPress owners biggest challenge is how to customize their theme. Specially when placing banner advertisement, they think they should
have PHP knowledge. If it is Graphene theme, then it will be very simple thing. Here I’m going to demonstrate how to put advertising banner to Graphene theme header ,just next to it’s title. This is dedicated for Graphene theme, but I can say, you will get an idea how to customize yours after following this tutorial.

1) Open Graphene Advanced option tab

Go to “Appearance” –> “Graphene Options” –> then “Advanced” tab

2) Enable header widget

Toggle “Action Hooks Widget Areas” and tick “graphene_top_bar” then save it.

3) Adding banner code

Go to “Widgets” and you will see new widget called “Graphene Header“, just add your advertisement code to here, but keep in mind width and height of banner, recommended height is 90-100 pixel and width is around 700-750 pixel for banner. Otherwise you may need to adjust your WordPress width and height. Just add some random word such as “ABC123” etc. we need to figure out text box id later, and those words will help us.

If you really need to adjust header banner height go to “Graphene Options” –> “Display” and change height from “Header Display Options”

4) Adding css to new Widget

Just open the site and view the source from web browser. More details can be find from here. Find the corresponding Widget-ID from it by searching string called “ABC123“.

Then go to “Graphene Options” –> “Display” , bottom of it you will find “Custom Css“, just add following css, don’t forget to replace text-id with yours.

That’s it. you can hide WordPress header image from “Customize” if you wish. Happy blogging …!!