How to Customize the Home Page

Last Updated: May 18, 2017 09:37AM PDT
The Custom Site Header is a basic HTML block that is displayed on the home page of the site. It can be customized with an image, text, or other embedded media.

From the Dashboard click the Edit Custom Site Header button in the Set up Site box.



The default text format is Display Suite Code, and to customize the page using code, use the Display Suite Code setting. To use a WYSIWYG editor, select Full HTML. The WYSIWYG editor has limited tools - more complex customization may need to be done using code.



To change the banner image, use the Display Suite Code Editor.
For suggested image size formatting for the banner, see Mukurtu Image Sizes and Resolutions for Site Customization
The default banner image is represented by this line of code:
<p><img alt="" src="sites/all/themes/mukurtu_starter/mukurtu_default_banner.jpg" width="1140" /></p>

To replace the default banner image with an appropriately sized and formatted image (the site will not resize or crop an image), replace the default code with the following, where the yourbannerimagefilename.png is the filename for an image that you have already uploaded to your site:
<p><img alt="" src="/system/files/atoms/image/yourbannerimagefilename.png" width="1140" /></p>

To find the filename of an image that you have already uploaded to your site, from the Dashboard click View Media in the Content and Collections box.



Click view on the desired image.



On the preview page, click on the thumbnail of the image.



The image will display at full resolution.
That filename can then be copy from the URL bar and pasted into the code provided above.





Click Save block when done.