Global CSS

This page shows Dealer Spike SEO employees the proper procedure on implementing Global CSS changes to our featurebannerbelowh1, pagefooter, disclaimers, and more. This will allow easy customization of images and allow the basic formatting to get the styling we want to allow for more text or make sure the Inventory shows above the fold. [Note: THIS ONLY WORKS ON V6 or later versions]



Global CSS Pages:

Details on the Global CSS Properties:

If you are looking to setup the Global CSS file on your client, you can find the instructions here:

If you are looking to use the Global CSS Buttons on your client's website, you can find the instructions here.

Image Property Options

There will be defaults for an image that is added with the editor. If you want to change the image, you can apply various classes via the inline editor in the same place you would add the image source URL, alt tag, and title tag. This would prevent you from needing to access the manage snippet editor when creating content for inventory list pages.


Below is a list of the different classes you can apply to to the image and what it does.

  1. Default
    1. This is the default format that applies to all images. This will apply the correct sizing of the image with some padding underneath with it aligned to the left
  2. Right
    1. When you apply the “right” class, this will have the same format as the default but align it to the right of the page
  3. Nopadding
    1. When you apply the “nopadding” class, this will be the same format as the default but remove the padding from the bottom of the image.
  4. Nopaddingright
    1. When you apply the “nopaddingright” class, this will have the same formatting as the default, but will remove the padding underneath and move the image to the right.
  5. Twentyfive
    1. When you apply the “twentyfive” class, this will resize the image from the default 20% to 25% in the cases you want a bigger image.

Button Property Options

Nothing is perfect and may require some adjustments to make it look better, especially on mobile. Here are some class that you can add to get different effects. This is a continuing list that has styles that are added to our Global CSS file.

Below is a list of the different classes you can apply to to the image and what it does.

  1. Default

    1. This is the default format that applies to all buttons. This will apply the correct sizing of the button with correct padding all around

  2. buttonsbelow 

    1. This will force the buttons below any images and text on its own “row” or “line” on the page

Other Property Options

There will be defaults for styles we can use for custom pages. If you find yourself designing similar CSS to large amount of clients, we can consider adding a class to expedite the procedure.

  1. seo-mobile-h1
    1. When you apply the “seo-mobile-h1” class to your <h1> tag, this will allow the resizing between screen sizes that our platform does not currently support.

Modifying the Global CSS Files (WARNING)

All the Global CSS files are in the SEO part of the server in the imglib folder under SEO and CSS.

SEO REPS ARE NOT ALLOWED TO CHANGE THE CODE IN THESE FILES

This is very important because changes in this file will affect all of our sites. Please speak with the SEO team lead if you are having issues of any kind. If you are allowed to edit this file, once the changes have been completed. The imglib folder’s cache needs to be cleared. Our SEO Support Agent or the Support Lead can quickly get this done with the file path.