|
sky
|
November 3, 2019 at 10:16 am
Hi
How can I add the “Hover-Function” (Overlay) to my event-grid?
Acutally, the event-name and “Registration” is placed under the event-picture and it doesn’t look really nice…
Have a look pls: https://www.skydesign.ch/neudikids_neu/kurse/
I also do not understand, why Registration is above event-name…in your documentation, the arrangement looks better.
Thanks for your help.
BR
Cristina
|
|
Tony
|
November 4, 2019 at 4:21 am
Hi Cristina,
The hover effect is actually built into the shortcode so you normally don’t need to do anything to enable it, however, it looks like none of the grid template scripts are loading on that page.
It looks like you’re using a page builder which can prevent Event Espresso from detecting the shortcode so it doesn’t know to load the scripts.
If you add the shortcode directly to the page itself, does it work then?
|
|
sky
|
November 9, 2019 at 5:48 am
Hi Tony
Thank you for your reply.
The hover-effect just works at the “Archiv” page.
But on all other pages it doesn’t work….thats so bad.
Is there any other possibility to get the hover effect?
Thank you so much
Cristina
|
|
sky
|
November 9, 2019 at 8:09 am
Hi Tony,
Luckily, the hover function works again!!!
But now I have another problem: The size of the photo-boxes is too small. I already use the code on espresso-grid-template.template.php
find the > $feature_image_url variable
You can change it to something like this:
$feature_image_url = $post->EE_Event->feature_image_url(array(400,400));
As well the css:
.ee_grid_box img {
height:auto !important;
}”
But now this is not working anymore….pictures are very thiny.
Do you know any solution?
https://www.skydesign.ch/neudikids_neu/kurse/
Thank you
Cristina
|
|
Tony
|
November 11, 2019 at 3:33 am
The hover-effect just works at the “Archiv” page.
EE doesn’t show the grid template on the archive so I’m not sure I follow.
But on all other pages it doesn’t work….thats so bad.
Is there any other possibility to get the hover effect?
As mentioned, if you are using a page builder, add the shortcode directly to the page.
Luckily, the hover function works again!!!
May I ask what changed for it to work?
But now I have another problem: The size of the photo-boxes is too small….
You’ll need some additional CSS to overrule the default:
.ee_grid_box_v2 img, .ee_grid_box_v2.item {
width: 400px;
height: 400px;
max-width: 100%;
}
You can add that to Appearance -> Customize -> Additional CSS
|
|
sky
|
November 11, 2019 at 3:46 am
Hi Tony
I have not the lightest idea, why “Hover” works again…. 🙂 🙂 🙂 I went to the site and…it worked!
Sorry for that…
Thank you so much for the CSS-code. I added it ant it works like cream! Thanks so much.
Cristina
|
|
Tony
|
November 11, 2019 at 4:32 am
I have not the lightest idea, why “Hover” works again…. ? ? ? I went to the site and…it worked!
Sorry for that…
Hmm, ok. So that sounds like it could be some form of caching.
If you have caching enabled on your site you’ll want to exlcude the EE critical pages from it (that wouldn’t have fixed the aove issue, but will prevent further issues down the line), see:
https://eventespresso.com/wiki/setup-nocache-exclusion-rules-event-espresso/
Thank you so much for the CSS-code. I added it ant it works like cream! Thanks so much.
You’re most welcome 🙂
|
