Thesis makes building unique, custom designs easier than ever. This tutorial will show you just how simple it is. Before we get started, however, please familiarize yourself with the basic concepts of the Thesis Custom Loop API.
Basic Template
Let’s start with a very basic example.
The first file you see is the one line of CSS for our basic example. We’ll be changing the body background to #000 (black). That is primarily there so we can see that we have successfully forced Thesis to regenerate the CSS.
The next file is the barebones custom_functions.php file. This is a skeleton class that will force Thesis to regenerate the CSS when the skin is initially installed. It is important to point out that this will only happen once.
- Copy/paste custom.css and custom_functions.php to your files in the custom folder (or you can download the tar ball here)
- Once you’ve installed everything, visit any page on the admin side.
- Look at your site. The body background should have changed to black.
| 1 2 |
|
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
|
Advanced Template
Obviously, a barebones skin class doesn’t really do much for the imagination. So, let’s take a look at a more advanced customization. Please read the notes in the code!
- Copy/paste custom.css and custom_functions.php to your files in the custom folder (or download the tar ball here)
- Once everything is installed, visit any page on the admin side.
This class does a few things:
- strips the container from the nav menu
- removes the default Thesis style.css
- excludes the default “uncategorized” category from the home page
- filters out some of the css related to the nav colors
- applies a simple CSS reset ($this->css_reset) that is now a default part of the thesis_custom_loop class
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
|
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 |
|