The Pique Theme help

vanessarachelk · Member · Feb 2, 2016 at 1:56 pm
Copy link

Add topic to favorites
Hello,

I’ve been using the Pique theme and I need some help with two things:

1. For some reason I cant seem to make the header image the size of the webpage. I’ve tried whatever CSS codes I could find for this, only one worked but it duplicated the photo rather than “stretching” it out to fit the page.

2. I’ve created a Learn more button but I want it to lead to an actual webpage, I have no idea how to do that!

please help me :(

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Feb 2, 2016 at 9:36 pm
Copy link
Hi there,

1. For some reason I cant seem to make the header image the size of the webpage. I’ve tried whatever CSS codes I could find for this, only one worked but it duplicated the photo rather than “stretching” it out to fit the page.

I’m seeing the featured image on your main page full width of the page right now. Is that what you are wanting when you say “fit the page”?

2. I’ve created a Learn more button but I want it to lead to an actual webpage, I have no idea how to do that!

I see a Learn More link on your About Us page, but it really isn’t linked to anything as it has # as the link, which will simply refresh the page. You heed to highlight the link text and click the Link icon in the toolbar and the put in the URL of the page you want it to link to.

If I’ve misunderstood any of the above, please let me know and we will get things sorted out for you.
vanessarachelk · Member · Feb 3, 2016 at 9:51 am
Copy link
Oh I had no idea anyone would reply so quickly!
I was trying out a different theme and that theme shows the header as the full width of the page!

I just switched back to Pique to show you the issue that is bothering me. If I’m on my laptop the header seems to fit perfectly on the page but if I’m on my desktop computer with a larger screen there’s always a space on the sides. Which to me looks unappealing.

Also about the learn more button, thank you so much! It worked :)
thesacredpath · Member · Feb 3, 2016 at 9:57 am
Copy link
Pique has an overall maximum page width of 1400px, which is why the header doesn’t go full width. It’s the way the them is designed. You can try the following custom CSS, which takes the overall maximum page width to 100%
```
.site {
max-width: 100%;
}
```
thesacredpath · Member · Feb 3, 2016 at 10:04 am
Copy link
In addition to the above, I would suggest including this.
```
.pique-panel-background {
    background-repeat: no-repeat;
    background-size: cover;
}
```
vanessarachelk · Member · Feb 3, 2016 at 10:16 am
Copy link
IT WORKED!!

Thank you so much!!
thesacredpath · Member · Feb 3, 2016 at 8:30 pm
Copy link
You are welcome.

No items found.