This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
|
overview:custom_design [2013/12/25 04:36] Alia |
overview:custom_design [2013/12/25 05:24] (current) |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ====== Design Customization ====== | + | ====== Design Customization ====== |
| This manual describes basic custom changes applicable to Oxwall themes. | This manual describes basic custom changes applicable to Oxwall themes. | ||
| Line 17: | Line 17: | ||
| * Existing CSS styles - shows you default styles. | * 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". | * 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". | ||
| - | |||
| - | {{:design:admin-appearance-edit-theme-css.png?300|}} | ||
| ===== Site Panel ===== | ===== Site Panel ===== | ||
| Line 94: | Line 92: | ||
| Result: | Result: | ||
| - | {{:design:console.png?300|}} | + | |
| + | {{:overview:console_final.png?300|}} | ||
| To add image as a background: | To add image as a background: | ||
| Line 279: | Line 278: | ||
| <option value="ow_ic_write"> Write </option> </code> | <option value="ow_ic_write"> Write </option> </code> | ||
| - | ===== Sign In Page===== | + | ===== Sign In ===== |
| - | Available styles for sign in page are located under /* ---- SignIn Form styles ---- */ section of the “Existing CSS Styles” form in Admin panel > Appearance > Edit Theme > “CSS” tab. | + | Available styles for sign in form are located under /* ---- SignIn Form styles ---- */ section of the “Existing CSS Styles” form in Admin panel > Appearance > Edit Theme > “CSS” tab. |
| - | ====Background color/image==== | + | ====Form Background color/image==== |
| To change background color add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab: | To change background color add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab: | ||
| Line 291: | Line 290: | ||
| | | ||
| Where #A9F5F2- is desired color code. | Where #A9F5F2- is desired color code. | ||
| - | |||
| - | Result: | ||
| - | {{:design:sign-in-custom-color.png?300|}} | ||
| To add background image: | To add background image: | ||
| Line 307: | Line 303: | ||
| Result: | Result: | ||
| + | |||
| {{:design:sign-in-custom-image.png?300| | {{:design:sign-in-custom-image.png?300| | ||
| }} | }} | ||
| + | |||
| + | ====Page Background color/image==== | ||
| + | |||
| + | To change background color of the whole sign in page add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab: | ||
| + | <code> | ||
| + | .ow_sign_in_cont { | ||
| + | background: none repeat scroll 0 0 #FFFFFF; | ||
| + | } </code> | ||
| + | |||
| + | Where #FFFFFF (white) - is desired color code | ||
| + | |||
| + | To add background image: | ||
| + | |||
| + | * Upload your image in Admin panel > Appearance > Edit Theme > “Graphics” tab > copy URL of uploaded image. | ||
| + | * Add following CSS in Admin panel > Appearance > Edit Theme > “CSS” tab: | ||
| + | <code> | ||
| + | .ow_sign_in_cont { | ||
| + | background:url("http:/sitename.com/ow_userfiles/themes/theme_image_29.png") repeat; | ||
| + | } | ||
| + | </code> | ||
| + | |||
| + | Where http:/sitename.com/ow_userfiles/themes/theme_image_29.png - is URL copied earlier. | ||
| + | |||
| + | Result: | ||
| + | |||
| + | {{:overview:sign-in-page-background.png?300|}} | ||
| + | |||
| ===== Footer ====== | ===== Footer ====== | ||
| ====Background color/image==== | ====Background color/image==== | ||
| Line 318: | Line 342: | ||
| } </code> | } </code> | ||
| - | Where **#A9F5F2** is desired color code.Result: | + | Where **#A9F5F2** is desired color code. |
| To add footer background image: | To add footer background image: | ||