Gallery on home page

Support
#1

Hello. Happy 2019 to all!

I’m trying to set up a section on my home page that basically links to different Envira Galleries…

I’ve created a row divided into 3 columns (right bellow the slider image)… my idea is that each of those columns shows a “cover” image that when clicked on opens the respective gallery. Envira provides this link: [envira-link id=“96”]Click here[/envira-link], but I don’t know how to “assign” that link to a “cover image”.

Another option would be to include that link generated by envira on a raw content element (like the ones used on the section right above the footer, titled: “Take a moment to explore nearby…” - please see link on secure note) ; but I haven’t been able to get that to work either :(…

Can you please help? Thanks!!

#2

Hi There @Jacko_Pinto

Thanks for writing in! It is possible with using Classic Raw Content element in Cornerstone. Basically you can create 3 envira galleries and get their respective link shortcodes.

Then place a raw content element into each of your Columns. And then you can set your images using HTML image tags and link your galleries.

Example code:

[envira-link id="165"]<img src="http://link.to/your/image.jpg">[/envira-link]

Hope that helps.

#3

Thank you very much for your reply and your help with this issue!

What if I wanted to use the shortcode in the following code ( please see attached -it’s what’s used in the bottom section mentioned in the original code)

Thanks very much!

#4

Hello @Jacko_Pinto,

You may use this code:

[envira-link id="165"]
 	<span class="bg" style="background-image: url(http://demo.theme.co/bed-and-breakfast/wp-content/uploads/sites/80/2017/09/restaurant-1.jpg);"></span>
    <div>
      <span>Hampton &amp; Croft</span>
      <small>Steakhouse and Cocktails</small>
    </div>
[/envira-link]

This may or may not work because the output of the envira galery alters the original structure of the code.

Hope this helps.

#5

It didn’t work :frowning:

The first suggested code didn’t work either…

How else can I resolve this? Please help1

#6

Hi @Jacko_Pinto,

In that case, would you mind providing your admin login credentials in the secure note? I like to check it directly, for the meantime, please do that in a separate dummy page where just one link and grid is present.

Thanks!

#7

Thank you very much. I have included all the required login info on a secure note.

Best regards!

#8

Hi Jacko

Thank you for the credentials, but I am confused, please clarify what you’re trying to do first.

Your original request is addressed by Darshana above, with this code:

[envira-link id="165"]<img src="http://link.to/your/image.jpg">[/envira-link]

That is for launching the Gallery Lightbox, it’s not for creating a link to another page.

Then you need to create your Gallery Page (with the Envira Gallery shortcode) manually and link it on your code:

<a href="YOUR GALLERY PAGE URL">
	<span class="bg"></span>
	<div>
		<span></span>
		<small></small>
	</div>
</a>

Cheers!

#9

Thank you for the reply.

Sorry If I didn’t explain myself.

First I wanted to launch the Gallery Lightbox from the home page… I tried that code you mentioned and it didn’t work.

Then I noticed that on the expanded demo I installed , they include a section which presents images in a cool way, so I wondered If I could launch the gallery lightbox from that. I also tried the code included by RueNel but it didn’t work either :frowning:

I’m wondering what the correct use of the code would be in both cases. Thanks for the help!

#10

Hello @Jacko_Pinto,

I have logged in to your site and edited your test page.
I used this code in the raw content element:

<div class="x-bnb-image-grid">

  [envira-link id="96"]
    <span class="bg" style="background-image: url(http://x.support/wp-content/uploads/2019/01/bg-standard.jpg);"></span>
    <div>
      <span>Murphy Standard</span>
      <small>From $149 a Night</small>
    </div>
  [/envira-link]

  [envira-link id="96"]
    <span class="bg" style="background-image: url(http://x.support/wp-content/uploads/2019/01/bg-exclusive.jpg);"></span>
    <div>
      <span>Murphy Exclusive</span>
      <small>From $289 a Night</small>
    </div>
  [/envira-link]

</div>

It is working as expected. Please check your test page now.

#11

Thank you very much! It seems the first (the one of the left column) works fine… if I click on it, the gallery lightbox opens up, but not if I click on the one on the right column.

Thanks for all the help!

#12

Hello @Jacko_Pinto,

The right column is not working because it is loading the same gallery. So I logged in again in your site, created another gallery and edited the page using this new gallery.

Both the columns now works displaying different galleries.

Please check the test page now!

#13

Awesome! Thank you very much for all your help!

#15

You’re welcome! :slight_smile:

#16

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.