Switching to the "Dallas" Template

1. Mobile Responsive
   
2. Full-width option
   
3. Choice of Left Rail, Right Rail or Both
   
4. Blog Previews on Website Pages
   

          

1. Left Rail
   
2. Full Width
   
3. Left and Right Rail
   

1. Go to Website / Structure.
   
2. Select the blue "edit page templates" button on the right side of the screen.
   

1. Select the blue "switch design" button.
   
2. Click the "Import Design" button for the Dallas Template.
   

1. Click the "Make Active" button and a green check mark should appear.
   

If this sounds like more than you wish to do on your own, you can hire the Membership Toolkit Team to update your site. For $175, we will switch your site to the new template, adjust the structure and design, have our graphic designer create a new personalized header for your site and 6 new buttons.

Social Media Icons

1. Go to Website / Structure
   
2. Find the Region "Header" block
   
3. Find the HTML Block "Top Header" and select "edit block"
   
4. On the Block Settings tab, use the HTML Content editor to add the icons and then link them to the appropriate URLs.
   

Header Backgrounds

The header is made up of a background color with the logo design on top.

1. Go to Website / Design Settings / Header. 
   
2. You will see there is a logo banner image which is the top image then there is a background image.  
   

Home Page Banner/Logo/Header

1. 
   Logo Image - this is usually your organization name and may include a graphic or logo
   
2. Header Background Image - a pattern or solid color that sits "behind" your logo image
   

1. Create your Logo Image to be 1350px wide x 240px tall.
   
2. Upload the image to your File Cabinet, then add it to the Logo Image. (#1 above)
   
3. Upload a "blank" image to your File Cabinet and add it to the Header Background Image. (#2 above)  A "blank" image file is attached to this article for your convenience.
   
4. Add this CSS to the Custom CSS area on your site. Custom CSS overrides the original instructions programmed for your site. Go to Website / CSS. Add it to the top of the CSS for best results.
   

/* Banner and Logo */

.logo.img-responsive img {
    max-width: 100%;
}

.inner-banner img {
    width: 100%;
}

.logo {
  padding: 0%;
}

ul.nav.navbar-nav.top_nav {
  margin-bottom: 0px !important;
}

This is advanced information! For assistance or questions, please submit a ticket to our Help Desk.

Auto Size Feature for Large Images

Please Note:  This is only for large images that you want to fill the screen. All other images should be sized to less than approx. 400px within a content page.

Page Template Options

1. Go to Website / Content / Add a new page or Edit an existing page / Go to the Visibility & Settings tab; Field - "Page Template."
   

1. Inherit - This will be the template set as the default.

1. Full Width - The content page will consume the entire browser window with no white space on the left or right side of the page.  Neither your site's left or right rail will present.
   

1. Fixed Width - The content page will be centered in the middle of the website browser window with white space on both the left and right sides.  Neither your site's left or right rail will present.
   

1. Fixed Left Rail - The content page will present along with the site's left rail.

1. Fixed Both Rail - The content page will present in between both the site's left and right rails.

1. Fixed Right Rail - The content page will present along with the site's primary left rail presented on the right.