Support

Home Forums Event Espresso Premium Submit Promotion Code button text cut off

Submit Promotion Code button text cut off

Posted: March 20, 2016 at 6:57 pm


Pete

March 20, 2016 at 6:57 pm

Using EE4, the ShowThemes’ Januas theme, and the Promotions AddOn – during the registration process, the text displayed in the button “Submit Promotion (code?)” is cut off. It only shows “Submit Prom” (and the next “o” is cut in half)).
Something similar happened with a registration button fixed with custom css line. Is this a generic button styling issue with Showthemes or Event Espresso?

Btw, the text field for this promotion code look unnecessarily and may be partially responsible for the button width being cut short(?).

(I’d include a screen shot if your support forum included an upload feature, so others could see my problem after we get it fixed) Otherwise – here
http://cchf.net/registration-checkout/#checkout

-Pete Koepfgen
WordPress 4.3.1
Event Espresso 4.8.36p


Tony

  • Support Staff

March 21, 2016 at 5:50 am

Hi Pete,

Turns out this is an issue with the theme, it is applying styles to any element that has a class of ‘button’ and setting the width to 138px – http://take.ms/Tw0nN

.button is a very generic selector and will apply to any elements with that class unless they have their own more specific rule set. Event Espresso follows your themes styling as much as possible, so if you theme applies a width of 134px to its button, that’s what you get unfortunately.

The fix in this case is just to apply a more specific rule for that button:

#ee-promotion-code-submit {
    width: auto;
}

I don’t recommend using .button to fix this as its just to general.

Btw, the text field for this promotion code look unnecessarily and may be partially responsible for the button width being cut short(?).

If we simply used ‘Submit’ then yes your right, the text would not have been cut off, it would look like this – http://take.ms/xUA4F

However that text was added specifically based on feedback from other users that registrants were getting confused with what the button was for.

(I’d include a screen shot if your support forum included an upload feature, so others could see my problem after we get it fixed)

For screenshots you need to host the image and post the link here, or use a service such as monosnap. We have further recommendations here:

https://eventespresso.com/wiki/troubleshooting-checklist/#screenshots

Just to note the checkout page uses your current session to display the page, so your session will be different from mine. Visiting this page directly:

http://cchf.net/registration-checkout/#checkout

Shows ‘Nothing in your event queue’ as you need to select tickets within an event first (they are assigned to your session id), its best to link to an event we can test on, otherwise we will find the first available event and run a test registration on that (which I did above)


Pete

March 21, 2016 at 7:43 pm

Thank you Tony, your recommended button modification CSS text worked great! I just copy & pasted it into the Appearances –> Editor –> Stylesheet.css

I included a comment to remind myself later what the css modification is for. So far I have collected the following css mods for the Januas by Showthemes.

/**reduces font size of title event**/
.home #slider #info-main-event h2{ font-size: 2.8em !important;}

/**overrides button width that Januas’ CSS uses to shorten all buttons**/
.spco-next-step-btn {
width: auto;
}

/**overrides Promotion Code button width that Januas’ CSS uses to shorten all buttons **/
#ee-promotion-code-submit {
width: auto;
}


Tony

  • Support Staff

March 22, 2016 at 3:56 am

When you edit the style.css file of the theme (which is what Appearances –> Editor –> Stylesheet.css is doing), if you update the theme you will lose those customization’s.

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

That way you can add the styles to override the theme in one of those and update theme/plugins without any problems.

The support post ‘Submit Promotion Code button text cut off’ 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