Docs

[quituck]

Hi,
I am wondering how do I set up 3 pictures side by side that I can click so I’m directed to a specific page?

I have tried use the essential gird and cornerstone but it does not provide me with the look I am trying to achieve.

Please see the picture and video attached.

[Friech]

Hi There,

Thanks for writing in, but your picture was not uploaded. In Cornerstone please create a 3 column ROW. And then place each of your image element on that columns.

Inspect your image element and enable the Link option then paste your URL on the HREF field below.

Hope it helps, Cheers!

[quituck]

Sorry my uploads failed the filed were too large. This definitely helped. Thank you!

I have another question is there a way to put text over the image? Such as a custom headline or another form of text.

[Thai]

Hi There,

You can add the custom headline elements below the images.

Then add the vertical-center CSS class to the class field of your custom headline elements:

http://i.imgur.com/1xHgDZ6.png

After that add the following CSS under Customizer > Custom > Global CSS:

.vertical-center {
  position: absolute;
    top: 50%;
    margin: 0;
    width: 100%;
}
.x-column.x-1-3 {
  position: relative;
}

Hope it helps 🙂

[quituck]

Yes it did. Thank you for your help.

[Christopher]

You’re welcome.

[quituck]

Last thing. Can you tell me how to change the font of the custom headline?

[Rupok]

Hi there,

Not sure what you are referring by font. Font size or font-family? However if you want to change them individually then use the Style field to place inline CSS like : font-family: “Lato”, sans-serif;

Or can add this under Custom > CSS in the Customizer.

.h-custom-headline{
    font-family: "Lato", sans-serif;
}

Hope this helps.

Cheers!

[Author]

Posts