Support

Home Forums Event Espresso Premium Change How Grid Layout Displays

Change How Grid Layout Displays

Posted: August 9, 2019 at 12:03 pm


mkreik

August 9, 2019 at 12:03 pm

I would like to change how the grid layout displays. Right now users have to hover over the image to see the title of the class and register link. I would like to change that so the title is above the image and the register link or button is below the image so our customers can quickly scan the event offerings. I don’t see the php for the grid template in the theme editor. Can I change the grid template php to display the events as I detailed? If so how do I change the php file? If I change the php file and either my theme or updates, will the php file be affected?


Josh

  • Support Staff

August 9, 2019 at 12:17 pm

Hi,

The simpler way to change this would be use CSS, and they if need be, you can make a copy of the PHP template can put the copy into your active WP theme. In other words, you copy the
espresso-grid-template.template.php file to your active WordPress theme, and make the PHP and html changes there.

Again though, that simple approach to avoid the hover would be to go to your site’s Appearance > Customize > Additional CSS page, and add the following:

.ee_grid_box_v2 .ee_overlay {
    top: 0;
}


mkreik

August 10, 2019 at 10:53 pm

Thanks! I used that and now can see the text over the image without having to hover over it. On the grid template page on the Event Espresso site (https://eventespresso.com/product/eea-events-grid-view-template/), the sample overlay shows the title, then dates and then register now. On my site it shows register now and then the title although I cannot see most of the title because of the image size. I prefer to have the title first and then learn more or show details as a button. Do I need to make changes to the php file to do that? Is there an order I can change in the settings that I may be overlooking?


Tony

  • Support Staff

August 12, 2019 at 5:04 am

Hi there,

There’s no setting to change the output but you can do it by changing copying the template used to your theme (preferably a child theme) and editing the file there, EE will use that in place of the default one.

If you are not using a child theme, follow this to create one:

https://developer.wordpress.org/themes/advanced-topics/child-themes/

Then, copy the template in use from /eea-events-grid-view-template/templates/

Place that template file in the child theme and then edit that copy.

To change it so the Register button is shown last, move line 47 to be after this line:

<p class="start-date"><?php echo $startdate; ?></p>

So it looks like this – https://monosnap.com/file/jie4JNaoylgLeXf1G8TVZYnFRv2Tdp


mkreik

August 20, 2019 at 8:43 am

Thanks.


mkreik

August 20, 2019 at 5:02 pm

I used Lilaea Media’s child theme configurator, which I have use before, and it doesn’t show any of EE’s php files to copy over to the child theme. I can see the php files for WooCommerce and other plugins, but not yours. Is there another way I can find and copy the grid template php from the parent to the child theme?

You must be logged in to reply to this support post. Sign In or Register for an Account

Support forum for Event Espresso 3 and Event Espresso 4.
Documentation for EE3 and EE4
Documentation for Event Espresso 3

Documentation for Event Espresso 4

Status: publish

Updated by  mkreik 3 hours, 39 minutes ago ago

Topic Tags

Notifications

This topic is: not resolved
Do NOT follow this link or you will be banned from the site!