[Resolved] Post box design

Home Forums Support [Resolved] Post box design

Home Forums Support Post box design

  • This topic has 42 replies, 4 voices, and was last updated 5 months ago by iamarghya.
Viewing 15 posts - 16 through 30 (of 43 total)
  • Author
    Posts
  • #2210695
    Ying
    Staff
    Customer Support

    Hey last question, If I delete the old GP block my old design all will be messed up?

    No, the data are stored in your database, once the new version installed and activated, the design will be restored.

    #2210698
    iamarghya

    Ok ok now bye, thanks again πŸ€—

    #2210705
    Ying
    Staff
    Customer Support

    No problem πŸ™‚ Sleep tight!

    #2210998
    iamarghya

    Hey, how to structure this? design when adding query loop there are 3 options, that I need to choose it will be helpful if you can give a quick screen record… There are 2 containers in the grid, I only have one 😐

    #2211023
    Fernando
    Customer Support

    Hello there,

    Here is a short screen recording I made as a sample: https://share.getcloudapp.com/WnuygQWq

    Hope this helps you start things off. πŸ™‚

    #2211036
    iamarghya

    I have made the design see but I have to first take a container or it is going in full width not contained,
    Now, what to do? for the hover effect?

    #2211101
    iamarghya

    Ummm Hello is anyone there?πŸ˜…

    #2211135
    Fernando
    Customer Support

    To achieve as such, you would need a setup as such:

    See: https://share.getcloudapp.com/o0uRnboJ

    Also see: https://share.getcloudapp.com/YEurnqgx

    Also see: https://share.getcloudapp.com/NQuNQLRO

    Also see: https://share.getcloudapp.com/X6uEwqkl

    As can be seen, there is a custom class my-absolute-content added to the Container Block of the content, and my-parent-container to the Parent Container.

    Then, add a CSS like this in Appearance > Customize > Additional CSS:

    .gb-container.my-absolute-content {
        position:absolute;
        bottom:-240px;
        width:100%;
        height:100%;
        transition: all 0.5s ease-in
    }
    
    .gb-container.my-parent-container {
        position:relative;
        overflow:hidden;
    }
    
    .gb-container.my-absolute-content:hover {
        bottom:0;
    }

    You’ll need to tweak -240px for instance and the 40px in the image attached on top depending on your design.

    Here it is working on my end: https://share.getcloudapp.com/L1uR1nPw

    Hope this helps! πŸ™‚

    #2211142
    iamarghya

    Yep I got it worked but see there are some border-radius and image height problem

    #2211145
    Fernando
    Customer Support

    Kindly set the borders in the Parent Container. πŸ™‚

    #2211150
    iamarghya

    Yep Done

    #2211151
    iamarghya

    I want the image in full size cover then headline…

    #2211154
    Fernando
    Customer Support

    Kindly try increasing the bottom padding of the Parent Container Block. πŸ™‚

    #2211156
    iamarghya

    But then what to do with the icon?
    See in the link I have sent u earlier

    #2211166
    Fernando
    Customer Support

    Kindly add a Buttons Block and modify the Button Block to have an icon without a text. Then, enabled Dynamic Data and set the link type to single post.

    Ex: https://share.getcloudapp.com/z8uLeDoN

    Then, modify the button to your preference.

    Hope this clarifies. πŸ™‚

Viewing 15 posts - 16 through 30 (of 43 total)
  • You must be logged in to reply to this topic.