Skip to main content

CSS stands for "cascading style sheets." In plain English, it means you can more efficiently control the design of HTML elements. Want all of your H1 headers to be red and italics? Done. Want your widget boxes to have a drop shadow? No problemo.

 

CSS is the jelly to HTML's peanut butter.

 

css-is-jelly-to-html-peanut-butter

 


 

Hoop.la includes easy ways to include custom CSS within the site framework as well as inside themes.

 

If you'd like to become more self-sufficient with your site, how about learning some CSS?

 

Free and Cheap CSS Online Courses

 

Example of How to Use CSS for Design

 

For example, if you'd like to make all H1 headers in your Hoop.la site a specific color, insert this code into your Display Settings > Custom CSS box:

 

h1 { color:red; }

 

You can use any color name, or use the hex code. If you apply this at the top level, in Display Settings, it will control all H1 headers across your entire site. If you want to control just the H1 headers in a specific theme, just place the custom CSS inside that theme's Page Shell > custom CSS area. 

 

Example of How to Use CSS for Feature Edit

 

This same trick can be used to actually hide Hoop.la features you don't want to use. For example, if you don't want to use the community ranking system, you can hide "community rank" from the interface completely.

 

Insert this code into the Display Settings > Custom CSS box:

 

<style type="text/css">

#communityRankProfileSection { display:none; }

</style>

 

After you've become a CSS expert, and created cool tricks for your Hoop.la site, why not come back and share? Show us your mad skills.

 

 

Image via Flickr CC: RVWTito

___________________________________________________________

I'd love to hear your thoughts here in the comments, or connect with me on Twitter.

Attachments

Images (1)
  • css-is-jelly-to-html-peanut-butter: CSS is the jelly to HTML's peanut butter

Add Comment

Comments (0)

×
×
×
Link copied to your clipboard.
×