New design resource: styling elements in LightCMS

LightCMS automatically provides default styles for content elements through its built-in CSS file.  However, there are times you might want to take the styling of the elements a step further and put some extra, custom polish on your sites.  Although you have always been able to view the CSS with developer plugins such as Firebug, we thought it would be helpful to create a reference guide that shows our default element styling. So, we did, and you can view it on our account support site at http://accountsupport.publishpath.com/styling-elements

The reference guide breaks things down by element and shows you all of the default CSS statements included for that element. This allows you to spot the statements you might want to override with your own CSS. The following is an example entry from the reference guide on the Blog element’s “list view.” The top image shows a blog list view entry and the statements below show the CSS that is applied to it. This is just a sample. You can see all of the entries in the reference guide.

style elements in cms

  1. /* blog listing */
  2. .blogList {
  3. padding: 0;
  4. }
  5. .blogList ul {
  6. margin: 0 !important;
  7. padding: 0 !important;
  8. list-style: none;
  9. list-style-image: none;
  10. }
  11. .blogList ul li {
  12. list-style: none;
  13. list-style-image: none;
  14. margin: 0 !important;
  15. padding: 0 0 5px !important;
  16. }
  17. .blogList ul li h2.postTitle {
  18. font-size: 25px;
  19. font-family: georgia, serif;
  20. line-height: 1;
  21. margin: 0 0 5px;
  22. font-weight: normal;
  23. }
  24. .blogList ul li h2.postTitle a {
  25. color: #000;
  26. text-decoration: none;
  27. }
  28. .blogList ul li .postBody {
  29. font-size: 12px;
  30. }
  31. .blogList ul li .postInfo {
  32. margin: 0 0 15px;
  33. color: #777;
  34. }
  35. .blogList ul li .postInfo span.postDate {
  36. color: #777;
  37. }

Tags

Archive

Try it today. It’s Free.

Takes less than 60 secondsNo commitmentNo payment information required

Get Started