Archived topic
Columns in the Header
4 replies · Started by Tomasz on January 14, 2017
Hi Mates,
Can you help me, I have no idea how to devide in GP Premium the header into for example three columns to make for example:
On the left - logo
In the middle - for example phone number
On the right - address of the office
Thanks for your help in advance
Tom
Hi
You will need to use GP Hooks i think, see this topic https://generatepress.com/forums/topic/2-sides-to-the-header-widget/#post-228923
Thanks for you reply. Do you know also if it works when I would like to devide for example section or another element like footer?
Tom
It's built into the theme so should work in sections and also the footer. See http://unsemantic.com for more grid classes.
Hi Tomasz, Jamal,
Here is a way to do it with CSS. Note that there will have to be additional CSS for mobile, but desktop it's fine :)

- add two text widgets to the Header Widget area and put the desired info in each one
- add a unique div to each text block as below for example:
<div id="tagline">Unit 42 - 1030 Main Street</div>
<div id="tagline2">Phone: (555) 555-1212</div>
- then add this CSS via Tom's Simple CSS plugin :)
#tagline {
font-size: 28px;
text-align: right;
color: #0080c0;
margin-top: 27px;
}
#tagline2 {
margin-top: -82px;
color: red;
font-size: 28px;
}
.header-widget {
width: 70%;
max-width: 80%;
}
Adjust the values as required and again, you will need additional CSS for the various mobile widths, but this is a start :)
Cheers!
Lyle