Oxwall Software Documentation

Admin panel > Appearance > Edit Theme > “Graphics” tab >

This feature allows you to upload custom images from admin panel and use URL/path to them within your custom design.

Images uploaded via this form are stored in /ow_userfiles/themes folder on your server. Therefore make sure that bother folders have 777 permissions. Alternatively you can upload your images directly via FTP or control panel.

Admin panel > Appearance > Edit Theme > “CSS” tab

Existing CSS styles - shows you default styles. Edit CSS - allows you to add your custom styles or edit default ones. To edit/add styles just add them into the box under “Edit CSS” section and click “Save”.

Site panel is a narrow gray line at the top of your site.

.ow_site_panel {
    background: none repeat scroll 0 0 #F4F4F4;
    border-bottom: 1px solid #E5E5E5;
    height: 41px;}

Default styles for site name within site panel :

.ow_logo_wrap {
        width: 1000px;
        margin: 0px auto;
        padding: 12px 0px 0px 10px;}
.ow_logo_wrap a {
        font-family: 'UbuntuBold', "Trebuchet MS", "Helvetica CY", sans-serif;
        font-size: 13px;
        text-transform: uppercase;
        color: #626060;}
.ow_logo_wrap a:hover {
        text-decoration: none;}

Use “CSS” tabs to edit those stile. Example bellow.

1. Upload your image in Admin panel > Appearance > Edit Theme > “Graphics” tab > copy the URL of upload image.
2. Go to Admin panel > Appearance > Edit Theme > “CSS” tab.
3. Copy/paste default styles (see above)into the “Edit CSS” box
4. Now it is time for some fun! Edit and save pasted styles to include your image, custom color and etc.:

    
   .ow_site_panel {
       background: url('http:link_to_your_upload_image_here.png') no-repeat scroll 0 0 #340404;
       border-bottom: 20px solid #E7AA37;
       height: 300px;}   
   .ow_logo_wrap {
    display:none;}

Where:

• background: url('http:link_to_your_upload_image_here.png') ()- shows your uploaded image.
• no-repeat- tells that your background image should not be repeated.
• #340404 () -sets the color for the rest of the site panel not occupied by uploaded image.
• border-bottom: 20px solid #E7AA37; () sets the height, type and color of the bottom border.
• height - sets the height for your site panel.Make sure it is not smaller then height of your image.
• ow_logo_wrap {display:none;}- removes your site name from top left corner of site panel.

Result on front end:

1. If your theme has an image as a background, disable default background image by adding following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab:

   .ow_page_wrap {
       background-image: none;
      }

2. Choose your own background color in Admin panel > Appearance >Edit Theme > “Theme Settings” tab >:
3. If your theme doesn't allow to set background in admin panel set your own background using following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab:

.ow_page_wrap {
    background-image: none;
    background-color: **#A9F5F2**;
   }

Result (default vs customized):

Add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab:

.ow_bg_color {
    background-color: **#A9F5F2**;
}

Add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab:

.ow_menu_wrap {
        background: none;
        background-color:#A9F5F2;
}

Add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab:

.ow_footer {
    background: none repeat scroll 0 0 #A9F5F2;
    
} 

Where #A9F5F2 is desired color code.Result: