Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account?Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress,GenerateBlocks).

Want to become a premium user? Learn more below.

GeneratePress GenerateBlocks

Set size for svg

  • Stefanie
    June 17, 2024 at 1:40 pm

    Hi team,

    I have created a page hero with two different background images.

    I would like the svg to sit as a small icon in the bottom right corner of the page hero. But the problem is that I can’t specify a size for the icon.

    I can only specify a WP size there via a dropdown:https://prnt.sc/9iSo-HVBqLFk

    But I would like to set the svg to 150 or 200px. How do I do that?

  • Ying
    June 17, 2024 at 1:46 pm

    Hi Stefanie,

    You have this CSS:

    .bg-gradient-hero {
background-blend-mode: normal,,; //the two, should be removed
background: url(https://demo.insight-inside.de/wp-content/uploads/2024/06/noun-nature-1.svg) bottom -20px right 4px / contain no-repeat, linear-gradient(135deg, rgba(97, 199, 163, 0.9) 0%, rgba(42, 106, 45, 0.9) 52%, rgba(5, 27, 6, 0.9) 100%), url(https://demo.insight-inside.de/wp-content/uploads/2024/06/goutham-krishna-h5wvMCdOV3w-unsplash.webp) 52% 66% / cover no-repeat;
}

    You’ve set the image size tocontain,just change it to150px.

    .bg-gradient-hero {
background-blend-mode: normal;
background: url(https://demo.insight-inside.de/wp-content/uploads/2024/06/noun-nature-1.svg) bottom -20px right 4px / 150px no-repeat, linear-gradient(135deg, rgba(97, 199, 163, 0.9) 0%, rgba(42, 106, 45, 0.9) 52%, rgba(5, 27, 6, 0.9) 100%), url(https://demo.insight-inside.de/wp-content/uploads/2024/06/goutham-krishna-h5wvMCdOV3w-unsplash.webp) 52% 66% / cover no-repeat;
}
  • Stefanie
    June 17, 2024 at 1:50 pm

    Hi Ying

    Thank you for your quick reply.

    The problem is that I can’t set it there. It’s also a dropdown, you can’t enter a free value there:https://prnt.sc/oe6ZHof9GBNG

  • Stefanie
    June 17, 2024 at 1:57 pm

    I have just discovered that you can enter a free value there if you know where 🙂

    Problem solved.
    Thank you 🙂

  • Ying
    June 18, 2024 at 9:05 am

    You are welcome 🙂

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