CSS for Eventbrite

• 

  takecareerofyourself · Member · Jun 29, 2015 at 5:35 pm

  • Copy link
  • Add topic to favorites

  Hi there,

  I recently read that the CSS is different for each theme. Where can I find a full list of CSS for the Eventbrite theme?

  Thanks!

  The blog I need help with is: (visible only to logged in users)

• 

  jasondayne · Member · Jul 1, 2015 at 12:33 am

  • Copy link

  Hi!

  This is a great question, but I’m not sure the answer will be all that helpful. Your site’s CSS is over 6,000 lines long and would be quite tedious even a CSS guru to read through.

  You can find it by opening the site in Chrome or firefox. Right click (PC) or two finger click (MAC) on any element on your page. Select the “inspect element” option. A window will open at the bottom or side of your page. You should see a tab for “Sources”. Select that tab. Then expand the “takecareofyourself.com” at the very top of the left-most column. Click on the “index” item that shows up under “takecareofyourslef.com”. The CSS will appear in the center column.

  If you are wanting to alter the CSS, you’ll probably just need to use dev tools (similar to the process above, by inspecting the specific element you want to change). It’s not too hard to learn a little CSS: check out codeacademy.com. They have an HTML and CSS course that will only take several hours to get the basics. Or you can see there are many posts on the forums here where users ask for help on specific items. If there is a header or button you want a different color or whatever just ask and people are willing to help you figure it out!

  Happy blogging!
  Jason

• 

  takecareerofyourself · Member · Jul 1, 2015 at 4:50 am

  • Copy link

  Hi Jason,

  Thanks for the info. So, was that incorrect that the CSS is different for each theme? In other words, I can apply any CSS code to my blog and it will work?

  Thanks,
  Josh

• 

  jasondayne · Member · Jul 1, 2015 at 1:31 pm

  • Copy link

  Josh,

  You’re welcome! The CSS is different for every theme and the way to adjust the CSS will be different. However, you don’t need to know all the CSS just to make a change because the way you will make changes for WordPress be by overriding the existing CSS. I know it’s a bit complex. Here’s an example:

  For your site the CSS ID for the title element would be “.logo-row h1” whereas for my main site it is “#welcome h1” The h1 part is the same because that is common for the website title to be done with the h1 HTML tag. So if we were going to make a change to the text, say make it red, we would just look up the ID for that element and then add whatever properties to it that we want. (For the red change it would be “color: red”. Then since we are overriding it, to make it simple, you can just add !important to make sure it overrides. Like so:

  #.logo-row h1 {
  color: red !important;
  }

  Kind regards,
  Jason

• 

  takecareerofyourself · Member · Jul 1, 2015 at 5:50 pm

  • Copy link

  Thanks Jason! So I just need to use the inspect element option to make sure that I’m applying the universal CSS code to the specific part of the theme. Makes sense, and I’m sure it will be simple once I play around with it. Appreciate the help!

• 

  jasondayne · Member · Jul 1, 2015 at 7:53 pm

  • Copy link

  Exactly! You explained it better than me!

  Best to you on your site! I love the title.
  —Jason

• 

  takecareerofyourself · Member · Jul 2, 2015 at 4:53 am

  • Copy link

  Thanks for the kind words and all the help!