Download the Photoshop (.PSD) file using the links above. If you don't have the font Adobe Garamound Pro on your computer you need to download that also (right click this link and choose "save file as...") and install it to your system. You will need to restart Photoshop after you install a font for it to show up in you Character list. More details.

Open the file in Photoshop and change the text to match your Department, Agency or Office Name. There are two layers labeled Copy Top and Copy Bottom. Choose either black or white for the colors. Save the file as a .PNG file with transparency. Upload to your web server. More details.

You need to update your index file, Do a Find for "Step 3" (there are comments above the areas you need to edit) and adjust the link image path and label. Be sure to do this step last as you will need everything in place prior to posting so things show up correctly. More details.

Step 4: Agency Background Image more details
&
Agency Slim Banner Image - Inner 2 columns page more details

If you have questions about any of the steps please email dlwebcom_doit@maryland.gov
  • The Font:
    Once you have the font on your computer you have to add it to your fonts folder. It is located in the control panel and is accssible from the Start Menu. Open the font folder, drag it in and drop it. You will have to close and reopen Photoshop for the software to recognize the added font.


  • The PSD File:
    Download the PSD file to your computer using the link above. Once you have it you should be able to double click on it. It should open in Photoshop.

  • The PSD File:
    The view you see above is the PSD file next to the layers pallete.
    • There are 3 items in the layers pallete
    • Copy Top (The part that reads "DEPARTMENT OF" in the green box)
    • Copy Botton (The part that reads "YOUR AGENCY NAME HERE" in the yellow box)
    • The transparent background

To edit the copy, simply double click the "T" icon next to the labels in the individual layers (Next to the white arrow above). They will highlight the associated copy in the workspace, then you can type in the correct information. Be sure they are all caps and you have selected Adobe Garamond Pro in the character pallete.


  • Updating Code on your Index Page
  • Locate your agency home page and Do a Find for "Step 3" (there are comments above the areas you need to edit). You will have to make 3 adjustments. Change the link so it points to your agency home page, change the path information that points to your graphic you just made and change the alt information to your agency name.

Step 4: Agency Background Image
  • Source file: egov/css/agency-styless.css



Banner Image at the small mobile:
  • If your agency title is short, crop agency title empty space to the right in Photoshop.
  • Email dlwebcom_doit@maryland.gov, if you need further assistance.
Banner image at the small mobile