Menu of SmugMug website with background (picture)

jakubmatejeccomjakubmatejeccom PraguePosts: 1Registered Users Beginner grinner
Hi All,

I would like to ask you if it is possible to have Menu of SmugMug website with background (picture)? Example of this here:
https://www.whiteshutterphotography.com/weddings
or
http://www.honzamartinec.com/svatby-wedding/

Currently I am working on my SmugMug website for Wedding Photography and this menu with background of wedding picture is very common (e.g. Squarespace, WIX, etc).

I already asked SmugMug Heroes support on this topic. But I received answer that it requires some advanced customization codes.

Based on your experience, please do you have any idea how to implement or if there is already some existed CSS code for this? Please could you help with this?

I think that it can be very beneficial feature/improvement of SmugMug website also for others users.

Many thanks,
Jakub
www.jakubmatejec.com
Tagged:

Comments

  • Hikin' MikeHikin' Mike Walkin' like a Penguin! Atwater, CaPosts: 4,302Registered Users Major grins
    edited April 23, 2017

    You'll have to change your site-wide layout to "Stretchy" first (Entire Site > Layout > 'Stretchy'). In the 'Margins', set your "Side Margins" to 0. In 'Sections', set your "Header Width" to 0 auto if it isn't set already. Set the other two to a width or leave it.

    You'll need the URL for the picture you want to use as the Header/Menu picture. Use the 'Share' feature. Now you'll have to add this to your site's theme CSS changing the yourpictureURLhere.jpg to the URL of your picture:

    .sm-user-ui .sm-page-layout-region-header {
        background: url( 'yourpictureURLhere.jpg' );
        }
    

    That should get you started.

Sign In or Register to comment.