Hero image photo - Post ID 269883

User 2844004 Photo


Registered User
225 posts

Ray wrote:
Hello all,
This is probally a very simple question BUT if I add a Hero Image to a Index page do I have to change it to a different name such as Hero Image-1 or can it it be done using Symbols or copy and paste.
Sorry to bother you all again.
Ray


I've used symbols for my 1920x600px hero's on my Valveco project. Here's how I did this:

Structure of the hero
    - hero-row (auto width)
    - - hero-column (auto height)
    - - - hero-container (auto width, max-width of 1920px, height 31,25vw (divide height by width, multiplied by 100), max-height of 600px, margin 0 auto 0 auto)

Now assign the images
    - Assign the first hero-image as background-image to the hero-container (As soon as you do this, a class is created, like 'container-1')
    - Remove the name of this class by hitting the 'x' and immediately type your custom class-name like 'hero-1'.
    - Select the row and add this to your list of symbols.

http://coffeecup.rvanheukelum.com/valveco-hero-symbols.png

Now, when adding these hero-symbols to your selection of pages you can change the hero images easily:

Create different hero's using just the one hero symbol using classes
    - Select the hero container
    - Apply a different background-image (don't de-select the container yet)
    - Immediately delete the current class-name and type your desired unique custom class-name like'hero-2', 'hero-3' and so on.

Just make sure your hero images already are 'ready for use'. Mine already are 1920x600px by 72dpi (I currently don't care for retina-ready images yet). Here's the live project ...

– Richard
Living in Zevenbergen, the Netherlands
13" MacBook Air M1 + 2x LG 24" IPS QHD / 8GB RAM / 500GB SSD / macOS 14.3 Sonoma
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

Thanks for posting. I'll try that later, when on my own computer.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2765857 Photo


Registered User
614 posts

Thanks Richard I will be also trying that hopefully later today. You have a excellent site, as a newbie (2nd class :) ) I just hope I can learn enough that ALL of you do so our business sites one day can look half as good as what you all do!

Ray
Ray aka Kreations
Since 1994 Chocolate bar wrappers for all occasions.
Since 1972 helping clients help "Discover Their Dream Vacation"
User 2844004 Photo


Registered User
225 posts

You're welcome :)
Living in Zevenbergen, the Netherlands
13" MacBook Air M1 + 2x LG 24" IPS QHD / 8GB RAM / 500GB SSD / macOS 14.3 Sonoma

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.