Support

Home Forums Event Espresso Premium Updating the look and feel

Updating the look and feel

Posted: March 30, 2016 at 6:51 am


tariqrazzaq

March 30, 2016 at 6:51 am

I have integrated event espresso with the eventica theme.. I would like to make the presentation of the form better… it feels very primitive at the moment. Also there are sections like comments, meta, recent posts which I would like to remove. I have changed the template but this does not seemed to have made any difference.


Lorenzo Orlando Caum

  • Support Staff

March 30, 2016 at 10:17 am

Hello,

We can share some feedback on getting you in the right direction.

This tutorial will show you how to inspect elements and then attach them to display none so they do not appear:

https://eventespresso.com/wiki/hide-certain-elements-event-espresso-pages-using-css/

If you would like feedback on a hiding a specific item on a page, then please share a link so we can see.

Thanks


Lorenzo


tariqrazzaq

March 30, 2016 at 10:48 am

Here is the website: http://www.mcevents.org.uk/eventica/eventbooking/bolton-family-fun-weekend/

Would like to remove
– search
– recent posts
– meta

Make the fonts bigger and easier to read
Update the button to something more presentable
Update the background


Josh

  • Support Staff

March 30, 2016 at 12:33 pm

Hi there,
It looks like the template that’s being used there is the single.php template. Is that the template that you modified? Can you post a copy of the template you modified into a paste bin or github gist and share a link here so we can review your code?


tariqrazzaq

March 30, 2016 at 7:48 pm

Can you confirm how you can style the dropdown, the text and the submit button to match the rest of the site


Tony

  • Support Staff

March 31, 2016 at 2:41 am

You will need to apply the same styles your theme is applying to those elements.

The theme is only applying styles to submit buttons with a class of ‘button’ or ‘btn’. So you’ll need to copy the styles and apply them to the EE buttons, for example the ticket selector submit button and dropdowns you can use:

.ticket-selector-submit-btn, 
.espresso_events select
{
    background: none;
    border: 1px solid #6a7a7c;
    text-transform: uppercase;
    border-radius: 2px;
    padding: 6px 10px;
    line-height: 1em;
    cursor: pointer;
    color: #2e3e40;
    box-shadow: none;
    text-shadow: none;
}

We recommend using either the My Custom CSS or Reaktiv CSS Builder plugins to add custom styles such as these.

Which text are you referring to?


tariqrazzaq

April 3, 2016 at 5:37 pm

How can I improve the update the look and feel of the page: http://www.mcevents.org.uk/eventica/eventbooking/bolton-family-fun-weekend/

It looks quite primitive and I would like to improve it significantly to match the website. DO I need to create a separate page?


Tony

  • Support Staff

April 4, 2016 at 5:13 am

We can’t view that page as it is password protected, can you either post a password we can use or remove the password from the post?

Event Espresso uses your sites theme to output the details so the output depends heavily on your theme. To alter the output you will likely need to create a custom template for your theme that will be used to output EE events.

Once we view the page we can see if this is the case.


tariqrazzaq

April 4, 2016 at 5:18 am

I have removed the password protection. Please take a look. It doesn’t look very good and I will be going live this week, so would appreciate your help


Josh

  • Support Staff

April 4, 2016 at 2:20 pm

Can you explain what “doesn’t look very good” and what’s “quite primitive” so we’ll know what exactly you’re looking to change here?

Along with that, if you can post a link where we can download the theme, we’ll have something to work with.


tariqrazzaq

April 4, 2016 at 5:24 pm

The search box, recent posts and meta sections are visible
The admin user is present
The text for the ticket spans two lines. This is due to the white box not being full width
The register button is a standard button
How do I remove hide details for each of the ticket options

The theme is a paid theme so not sure where I can upload to.

Can you provide guidance asap


Josh

  • Support Staff

April 4, 2016 at 5:27 pm

Right, we’ll at the very least need to see a copy of the theme’s single.php template. If possible, you can upload a copy of the theme to a dropbox account and post a link here. We will need to see some code from the theme in order to give you guidance on how to remove the theme’s sidebar.


tariqrazzaq

April 4, 2016 at 5:59 pm

Here is the link https://onedrive.live.com/redir?resid=457247CD5D3EF7F7!122370&authkey=!AH-74QOqhpwRbjk&ithint=folder%2cphp


Tony

  • Support Staff

April 5, 2016 at 5:48 am

Can you upload the full theme .zip to either your drive account or something like dropbox and email the link we can download it from to support[at]eventespresso.com please?

The post is password protected again so I can’t view most of what you need changing. It will be easier to setup and view this locally if we have the theme.


tariqrazzaq

April 5, 2016 at 6:44 am

Hi TOny

I have sent you the theme

Tariq


Josh

  • Support Staff

April 5, 2016 at 10:36 am

Hi Tariq,

If you haven’t done so already, you’ll need to install the child theme that’s included with the Eventica theme. Then after that you add a template and a line of code to your child theme’s functions.php file. Here’s a link to the gist that has the code:

https://gist.github.com/joshfeck/4a2b60e95decec5ccc115ad7c00ee47c

The above code will change the single event view to display full width, with no sidebar.


tariqrazzaq

April 5, 2016 at 6:24 pm

Thanks… That seemed to work. However when I go to the registration checkout page, the page has the sides areas again. Can you let me know how to make the pages full width.

Can you explain what the code in the function does and how it links to the single_page_espresso.php page… Just trying to understand link


Tony

  • Support Staff

April 6, 2016 at 3:57 am

However when I go to the registration checkout page, the page has the sides areas again. Can you let me know how to make the pages full width.

The checkout page is a standard WordPress page, you can edit that page and set the page template to full width in the same way you would any other.

The same goes for your thank-you page if you find the same problem there, its because your theme is displaying a sidebar for all pages.

Can you explain what the code in the function does and how it links to the single_page_espresso.php page… Just trying to understand link

This may just be a typo, but it will make a difference so just confirming, this:

single_page_espresso.php

should be:

single-espresso_events.php

Basically when you use a template file to take over the output of EE single events (single-espresso_events.php), EE assumes you are taking full control of the layout of that page. This means it disables the custom order function we have available within Event Espresso to allow you to set the order however you want within the template. The code in functions.php just tells Event Espresso not to do that.

The support post ‘Updating the look and feel’ is closed to new replies.

Have a question about this support post? Create a new support post in our support forums and include a link to this existing support post so we can help you.

Event Espresso