[Resolved] Wp Show Posts and Disclaimer

Home Forums Support Wp Show Posts and Disclaimer

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #936678
    Paolo Fauci

    I’m using generatepress with Elementor and the Flint Skin theme

    the problems encountered are the following

    1 Wp Show Post I tried to create a new setting as explained in their video tutorial
    https://wpshowposts.com/
    however this is the result
    http://www.test.bigpaolo.it/ua/
    Immagine is not taken with the measures with these measures 600×250
    It is also set aside when I ask about the title.

    What should I do?

    2 A last request I would like to insert in the Footer a Disclaimer 5 lines of text.
    I would like to insert the Disclaimer in the footer below the widgets without excluding them and activate for the whole site
    I can do it? how you do it?

    I await your news
    Thank you

    #936786
    David
    Staff
    Customer Support

    Hi there,

    1. the Liberte site has some Custom CSS that is designed to work with a Single Column WP Show Posts list – so if you want to edit the List and set columns to 1 then you should see a similar result to what is used on the home page.

    2. The footer bar has its own widget area so you could add your content to that, this will leave the footer widgets intact.

    #937090
    Paolo Fauci

    Hi, David

    thank you very much for your support.

    By the time of the Disclaimer I managed to insert it, the only thing I noticed is that the text “ยฉ 2019 Flint Skin | a PaoloFauci Site” moves to the left and does not remain in the center …
    But it can also be good this way

    For WP Show Posts by default the site puts this setting
    http://www.test.bigpaolo.it/writing/

    But I would like 3 columns image title and button in this order, which is shown in the video tutorial.

    I tried to make the changes you suggested on WP Show Posts but the problem persists by putting 1 column I see this way
    http://www.test.bigpaolo.it/ua/

    image 660×250 is taken but it is on the left instead of above as I have set
    Then there are no side margins and finally it is not the result I want

    I would like to type this I attach you image
    https://ibb.co/DzNjJ04

    Can you give me some suggestions?

    Thank you
    Paolo

    #937096
    David
    Staff
    Customer Support

    So in Customizer > Additional CSS look for and remove this CSS:

    @media (min-width: 600px) {
    
        body:not(.single):not(.page) .inside-article,
        .wp-show-posts-inner {
            display: grid;
            grid-template-columns: 30% auto;
        }
    
        .post-image,
        .entry-summary,
        .wp-show-posts-image {
            margin-top: 0;
            margin-bottom: 0;
        }
    
        .post-image,
        .wp-show-posts-image {
            grid-column: 1;
            grid-row: 1 / 4;
            margin-right: 2em
        }
    
        .entry-meta {
            grid-column: 2;
        }
    
        .post-image img,
        .wp-show-posts-image img {
            -o-object-fit: cover !important;
               object-fit: cover !important;
            height: 100% !important;
            vertical-align: middle;
        }
        
    }

    Also the site uses a Layout Element which is covered in this article:
    https://gpsites.co/liberte/make-liberte-your-own/

    And more details here:
    https://docs.generatepress.com/article/layout-element-overview/

    This is what sets the page to full width, you will need to edit that Layout Elements display rules if you wish to exclude pages from the full width container.

    #937293
    Paolo Fauci

    Thank you very much David

    With the CSS I would never have arrived!

    Now I can see well on three columns I have to make some changes but it is definitely better than before.

    I created a new Element for HomeBlog and set it on this page

    http://www.test.bigpaolo.it/ua/

    and I managed to paginate the content.

    Thanks for your time
    Paolo

    #937455
    David
    Staff
    Customer Support

    Glad to hear that ๐Ÿ™‚

    #937965
    Paolo Fauci

    Hi, David
    Yesterday when I edited the CSS I had doubts:

    I deleted from the line from line 14 to line 48 now appears to be a space between line 11 and 17 I have to delete these lines or not.
    Here is the picture
    https://ibb.co/bLgF847

    Following your directions here
    https://gpsites.co/liberte/make-liberte-your-own/
    Blog conteiner I realized that I can add margins, however this page
    http://www.test.bigpaolo.it/ua/ is not affected by changes and is viewed from both Desktop and Mobile and without borders.

    I added a new element in Generatepress and giving a width of 1000px and in this case in the desktop version it is ok while in the mobile version it remains without a border and is ugly to see.

    The only way I found is to create the page with Elementor in that case the page looks good both on the desktop and the mobile.
    http://www.test.bigpaolo.it/ua2/

    Is there a way to do this with only with GeneratePress?
    =================================

    I’m trying to customize the menu and header
    However I have noticed that if I put the logo the menu does not remain on the right but is moved under the logo to the left.

    I tried to reduce the logo but it’s always the same thing.
    Only if I put the logo in text format does the menu remain on the right side.
    Is there a way to keep the mobile logo on the right and menu on the left as in the desktop?

    here is the image
    https://ibb.co/8XpCgTp
    =================================

    I also modified the Avatar Author size using CSS
    I noticed the dots 2 things:

    There are 3 dots with the link to the home page

    Can another link be set?
    To remove the link I have to delete this:

    .author-links to {
    font-size: 3em;
    line-height: 0.5em;
    float: right;
    margin-top: -10px;
    }

    How do I translate “About” is in wordpress CSS?
    When updating wordpress do I have to remember to always update the file?
    =================================

    GP Social Share I noticed that in the Desktop version it flows, while in the mobile version it remains above image.

    How can I set in the desktop version scrolls and in the mobile version under the content?

    If I change the images and the size of the icons if there is a GeneratePress update these changes remain or should I reload to the image changes and the size?
    =================================

    This theme is very fast in loading pages but for me it is a bit complicated to make the settings.

    Finally, I would like to know if all or some of these changes are permanent or if there is an update to GeneratePress I lose the changes.

    I await your news
    Thank you
    Paolo

    #938121
    David
    Staff
    Customer Support

    OK so one at a time:

    1. You can remove the empty lines 11 to 17.

    2. On the original site there was a single Layout Element assigned to Pages and Templates. Edit this and change the display rules so it only applies to Pages that Elementor is using. Then remove any other Layout Element you have created. Pages will then use the Default GP layout including padding and margins.

    3. Logo position – did you fix this as its displaying correctly for me.

    4. In Appearance Elements you will see a Hook called Author Block – you can carefully edit this to change the ‘About’ text.

    5. GP Social Icons. Go to appearance > Elements and create a New Hook.
    Add the GP Social Shortcode: [gp-social] to the content.
    In the Hook Drop Down select Custom Hook and add generate_after_entry_content in the field provided.
    Check the execute shortcodes box.
    And on Display Rules select Posts > All Posts.

    Then in customizer > additional CSS add this code to the bottom of the CSS:

    @media(max-width: 768px) {
        .floating-container {
            display: none;
        }
    }

    The icons will not change if the Theme updates.

    6. All of these changes will remain when the theme updates.

    #938165
    Paolo Fauci

    Thanks David

    1. I have removed the empty CSS lines

    2 I put in draft the two elements:
    Page builder Original layout
    BlogPostHome created by me

    Through => Customize => Layout => Container I have the possibility to set side margins but they have no effect on the page display.

    In the Desktop version there are now small margins on the right and left
    In the Ipad Version in Vertical Title and Button are not in line with Image (this also happens with the page created with Elementor)
    In the Mobile Version image, title and button are attached to the edges.
    http://www.test.bigpaolo.it/ua/

    I believe the only compromise is Elementor
    http://www.test.bigpaolo.it/ua2
    ======================================

    3. Menu Mobile: sorry I’m wrong to write
    I wanted to say that I would like the logo (image) on the left and menu to the right of the screen all on the same line
    This I see well only if I use the text and not the logo (image).
    With the logo (image) the menu goes down and does not remain on the right.
    I tried to insert a small images but it is always the same.

    Here’s how I see it
    https://ibb.co/ZH13BDY
    ======================================

    4 I managed to edit Element Author

    5 GP Social Share I managed to make the changes you suggested. However now in the Desktop Version I have two “GP Social Share” one a “Vertical float” and a vertical one after the content.
    This is not good!
    While in the mobile version it’s ok I see GP Social Share under the content and horizontally.

    I await your news
    thanks a lot
    Paolo

    #938212
    David
    Staff
    Customer Support

    2. So you have no other layout elements assigned to those pages? Currenty they have a Page Builder setting of Contained which is why there is no padding, that setting needs to be Default.

    3. Either add a smaller logo to the Mobile Header or use this CSS to reduce its size:

    .site-logo.mobile-header-logo img {
        height: auto;
        width: 150px;
    }

    5. Add this CSS to remove the second one from desktop:

    @media (min-width: 769px) {
        footer + #gp-social-share {
            display: none;
        }
    }
    #938348
    Paolo Fauci

    Hi, David

    1. Finally I managed to understand why nothing was happening on this page when I moved the margins!

    In the page settings
    http://www.test.bigpaolo.it/ua/
    in the Layout section I had selected Contents

    https://ibb.co/tJ2ZQzL

    As soon as I selected Default I was able to set the margins from both Mobile and Desktop

    By “Tablet” setting I have turned on my ipad and I must say that it looks great both vertically and horizontally and the image, title and text are aligned.
    The wordpress preview in this case is not reliable!

    2. I had already done the test by inserting a 150px logo but nothing happened with your little suggestion by entering the new CSS I was able to get the result.

    From mobile now you can see well: https://ibb.co/ss8JNVL

    3. Even for GP Social Share, entering your Css is now ok

    David, if I can I would like to ask you one last thing

    The edges of the buttons I would like to set them slightly rounded as in this image

    https://ibb.co/w70Bd85

    Who controls GeneratePress or Wp Show Posts?
    I tried some tools to manage the css commands but but I don’t want to make mistakes.

    I would like to give the “Read more buttons” the rounded shape
    border-radius: 10px;

    I believe that I can modify the text and the color through “Personalize”

    See you soon
    Thank you so much

    #938404
    David
    Staff
    Customer Support

    Awesome ๐Ÿ™‚

    You can target the WP Show Posts read more to add a border radius like so:

    a.wp-show-posts-read-more {
        border-radius: 10px;
    }

    The button should pick up the standard button colors in the customizer – if not then we can use some CSS to style e.g:

    a.wp-show-posts-read-more {
        border-radius: 10px;
        color: red !important;
        border-color: green !important;
        background-color: blue;
    }
    a.wp-show-posts-read-more:hover {
        color: blue !important;
        border-color: yellow !important;
        background-color: red !important;
    }
    #938646
    Paolo Fauci

    Thank you very much David for the suggestion.

    I have made some changes to the CSS to customize the font size and the various colors.

    This is the code and it is working well

    http://www.test.bigpaolo.it/ua/

    a.wp-show-posts-read-more {
    border-radius: 10px;
    font-size: 18px! important;
    color: #FFFFFF! important;
    border-color: #FFFFFF! important;
    background-color: # 1e72bd! important;
    }
    a.wp-show-posts-read-more: hover {
    color: #FFFFFF! important;
    border-color: #FFFFFF! important;
    background-color: # a2be4e! important;

    }

    Thank you for your time.
    See you soon
    Paolo

    #938740
    David
    Staff
    Customer Support

    Looking good!
    Glad to be of help

Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.