[Resolved] Single Page like

[Jatin]

Can you please advise what i need to do for creating a single page exactl like below in GeneratePress.

View post on imgur.com

[David]

Hi there,

1, Shadow below the navigation – you will need to set the Customizer > Layout > Primary Navigation to Full Width. Then add this CSS:

.main-navigation .inside-navigation {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

2. Are you looking to change the form?

3. I can only see one social icon on your site?

4. You would need a recent posts with thumbnails plugin :

https://wordpress.org/plugins/recent-posts-widget-with-thumbnails/

[Jatin]

Hi David,

Thanks for the response.
I have tried to find Primary Navigation to Full Width Option but could not find it as per your instructions: https://imgur.com/zCJIEZI

# Are you looking to change the form? I am using Jetpack so is it possible to have a form like this and remove with just email address and Subscribe button ?

# I can only see one social icon on your site? Yes, Currently have got only one but i want to change the layout to look more like the ones which i sent in private chat and hover over links like same as that one ? Is it possible.

# You would need a recent posts with thumbnails plugin : Thanks I will try that one.

+ How can i adjust the spacing between the Sidebar Widget Title and Content.For example: https://imgur.com/M178V0U

[David]

Which version of GP Premium are you using ?

[Jatin]

3.0.0-beta.3 + 1.12.0-rc.2 (All Latest) I purchased the theme yesterday.

[David]

Can you tempoararily disable the GP Premium Plugin. Go to Customizer > Layout > Primary Navigation – does the option to change the width appear?

If so – change it and the re-enable the GPP plugin.

[Jatin]

I did exactly as you said. No it does not show still. Here is what i see there: https://imgur.com/6Sk5CZq
Can you please check on your test environment and let me know.

[Leo]

The navigation width option actually won’t show when the location is set to float right.

Can you try adjusting the header width instead?
https://docs.generatepress.com/article/header-layout/

[Jatin]

Thanks Leo,
1. Can i keep the existing layout of my site and use box shadow. Right now it does not work.
2. BTW – https://imgur.com/M178V0U is fixed i searched in the forum and found some css code to fix it. But how can i create a newsletter form as per the screenshot ?
3. the Social Site Icon Customization as per the first screenshot of this post ?

[Leo]

1. Something like this?

.single.separate-containers .inside-article, .single.separate-containers .widget {
    -webkit-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}

2. You will need a plugin for that. Something like MailChimp or Ninja Forms.

3. The example if using this plugin:
https://en-ca.wordpress.org/plugins/simple-social-icons/

[Jatin]

1. Something like this? – Thanks for the code i tried but had no affect on the page.
2. You will need a plugin for that. Something like MailChimp or Ninja Forms. I will check this.
3. The example if using this plugin: That Worked Fine. Thanks.

[Leo]

1. That code would only apply to single posts which is what I thought you needed.

Which page are you trying to apply the code on?

[Jatin]

Thats for the whole side really. If you check the Example Site i sent in a private chat. You can see the header is having a raised up look throughout the site you can browse through the demo content but header is raised and looks distinct. I know its a different theme but i think this should be possible using css.

[Leo]

This should work:

.site-header {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

[Jatin]

Thanks Leo this does work.

[Author]

Posts