Support

January 24, 2015 at 11:35 am

Hi Ryan,

The link that you shared is for the default events listing page.

Think of the events grid view template as another way to present your event information. It doesn’t replace the default events listing page.

However, you can create a new WordPress page through your WordPress dashboard and then add the following shortcode:

[ESPRESSO_GRID_TEMPLATE]

Be sure to save changes to that new WordPress page.

You could then change the link in your website’s navigation to point to the the new WordPress page.

This can be done through your WP dashboard –> Appearance –> Menus screen.

Thanks.

—
Lorenzo

January 26, 2015 at 4:02 am

Hi,

What version of the addon are you using please?

It looks like the CSS is not loading, but currently I cannot see why that is.

Are you using any Cache plugins?

January 27, 2015 at 1:22 am

And you are using the latest version of the Grid addon or a different version?

Can you try temporarily disabling all plugins except EE and the EE Grid plugins? Does the grid start working at that point?

January 27, 2015 at 2:03 pm

Hi Ryan, it looks like your theme isn’t loading the CSS file for the grid view template.

Manually adding the CSS through Safari developer tools appears to fix the styling:

http://cl.ly/image/403r0w1V2D2T

Update your template add-on for Event Espresso to the latest version.

Then if that doesn’t help, then add the following CSS to your child theme’s stylesheet or through a plugin like My Custom CSS or Reaktiv CSS Builder:

/* -------------------------------------------------------------------------
 * Event Espresso Grid_Template Stylesheet
 * (c) 2014 Event Espresso
 * -------------------------------------------------------------------------*/

/*
General Styles
---------------------------------------------------------------------------------------------------- */
.ee_grid_box img {
	width:200px;
	height:200px;
}

.ee_grid_box {
	text-align:center;
}

.ee_grid_box a {
	margin:10px;
	float:left;
}

.ee_grid_box a.darken {
    display: inline-block;
    background: black;
    padding: 0;
    position:relative
}

.ee_grid_box a.darken img {
    display: block;
    
    -webkit-transition: all 0.5s linear;
       -moz-transition: all 0.5s linear;
        -ms-transition: all 0.5s linear;
         -o-transition: all 0.5s linear;
            transition: all 0.5s linear;
}

.ee_grid_box a.darken:hover img {
    opacity: 0.4;           
}
.ee_grid_box a.darken span{
	position:absolute;
	top:5px;
	color:#000;
	left:10px;
	right:10px;
	opacity:0;
}

.ee_grid_box a.darken span h2 {
	font-size:130%;
}

.ee_grid_box a.darken:hover span{
	color:#fff;
    -webkit-transition: all 0.5s linear;
       -moz-transition: all 0.5s linear;
        -ms-transition: all 0.5s linear;
         -o-transition: all 0.5s linear;
            transition: all 0.5s linear;
	opacity:1;

}


/* Media Query for screens smaller then 768px (iPad portrait)
---------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 767px) {
}

@media only screen and (max-width: 600px) and (min-width: 481px) {
}

@media only screen and (max-width: 540px) and (min-width: 480px) {
}

@media only screen and (max-width: 480px) {
}

—
Lorenzo