Layout Modifications

Hi there,

lets tackle a couple at a time:

1. If you're using the Gutenberg block editor then you chose the the Wide Width option in the block toolbar to do this. If not you can use try this rather hackish CSS that applies a similar method:

.entry-content img {
    margin: 32px -40px;
    max-width: unset;
    width: calc( 100% + 80px);
}

/* Adjust for mobile padding */
@media (max-width: 768px) {
    .entry-content img {
        margin: 32px -30px;
        width: calc( 100% + 60px);
    }
}

2. Fonts:
Body is set to System Stack font - so this will be displayed as a Sans font that your browser chooses. e.g Chrome will display Roboto.

Headings: Quicksand

3. Customizer > Layout > Header -> Enable Navigation as Header.

4. This CSS for the border radius:

.post-image-above-header .inside-article .featured-image img {
    border-radius: 4px;
}

Note: you will see the Content White background - so the effect only really works if you set the Colors > Background > Content to match the body.

Thanks David for the help , got what i want.

Btw , i noticed you didn't answer #5

5. Post Meta Data : Where can i modify post meta data to something like this : https://imgur.com/I2w3KbL

Also , i'll like my articles to show the last modified date and not published date.

Any help here?

Thank you.

5. Try this to rearrange the meta to be author > date:
https://docs.generatepress.com/article/generate_header_entry_meta_items/
Adding PHP: https://docs.generatepress.com/article/adding-php/

Then add this to show updated date:
https://docs.generatepress.com/article/show-the-updated-post-date/
Adding CSS: https://docs.generatepress.com/article/adding-css/

Hello ,

I used the code and CSS here for author profile : https://generatepress.com/forums/topic/gravatar-image-is-not-showing-on-author-profile/ . Works great but looks jammed. Any way i can add spacing to make it look neat?

https://imgur.com/kW8cHd6

Also , i'll like to get rid of the related post navigation. Doesn't look good.

Try adding this CSS to put some space above the Author box:

.author-box {
    margin-top: 2em;
}

You can uncheck: Display post navigation in Customizer > Layout > Blog --> Content > Single (tab)

Hi ,

I'm back again

1. How can i remove links in Post author and date meta? : https://imgur.com/bd3Ijbm

2. I'll like to move author box above social share buttons : https://imgur.com/adCOH2i

Thank you!

Hi there,

1. These should help:
https://docs.generatepress.com/article/generate_post_author_output/#remove-link
https://docs.generatepress.com/article/generate_post_date_output/#remove-link-from-date

2. How are the social icons being added to the page?

1. Where should the hooks be placed (before_content_ , before_main_content , e.t.c)?

2. I'm using scriptless social share wordpress plugin (https://wordpress.org/plugins/scriptless-social-sharing/)

1. those codes cannot be added using the Hook Element. This doc explains the methods you can use:

https://docs.generatepress.com/article/adding-php/

2. In the plugin settings you can uncheck the locations. And then use a Hook Element to add the shortcode they provide:

[scriptless]

You can use the same Hook as the Author box just give it a higher priorty number then the author box hook.

All good , thank you!

You're welcome