|
1 <?php if ( ! defined( 'OT_VERSION' ) ) exit( 'No direct script access allowed' ); |
|
2 /** |
|
3 * OptionTree documentation page functions. |
|
4 * |
|
5 * @package OptionTree |
|
6 * @author Derek Herman <derek@valendesigns.com> |
|
7 * @copyright Copyright (c) 2012, Derek Herman |
|
8 * @since 2.0 |
|
9 */ |
|
10 |
|
11 /** |
|
12 * Creating Options option type. |
|
13 * |
|
14 * @return string |
|
15 * |
|
16 * @access public |
|
17 * @since 2.0 |
|
18 */ |
|
19 if ( ! function_exists( 'ot_type_creating_options' ) ) { |
|
20 |
|
21 function ot_type_creating_options() { |
|
22 |
|
23 /* format setting outer wrapper */ |
|
24 echo '<div class="format-setting type-textblock wide-desc">'; |
|
25 |
|
26 /* description */ |
|
27 echo '<div class="description">'; |
|
28 |
|
29 echo '<h4>'. __( 'Label', 'option-tree' ) . ':</h4>'; |
|
30 echo '<p>' . __( 'The Label field should be a short but descriptive block of text 100 characters or less with no HTML.', 'option-tree' ) . '</p>'; |
|
31 |
|
32 echo '<h4>'. __( 'ID', 'option-tree' ) . ':</h4>'; |
|
33 echo '<p>' . __( 'The ID field is a unique alphanumeric key used to differentiate each theme option (underscores are acceptable). Also, the plugin will change all text you write in this field to lowercase and replace spaces and special characters with an underscore automatically.', 'option-tree' ) . '</p>'; |
|
34 |
|
35 echo '<h4>'. __( 'Type', 'option-tree' ) . ':</h4>'; |
|
36 echo '<p>' . __( 'You are required to choose one of the supported option types when creating a new option. Here is a list of the available option types. For more information about each type click the <code>Option Types</code> tab to the left.', 'option-tree' ) . '</p>'; |
|
37 |
|
38 echo '<ul class="docs-ul">'; |
|
39 foreach( ot_option_types_array() as $key => $value ) |
|
40 echo '<li>' . $value . '</li>'; |
|
41 echo '</ul>'; |
|
42 |
|
43 echo '<h4>'. __( 'Description', 'option-tree' ) . ':</h4>'; |
|
44 echo '<p>' . __( 'Enter a detailed description for the users to read on the Theme Options page, HTML is allowed. This is also where you enter content for both the Textblock & Textblock Titled option types.', 'option-tree' ) . '</p>'; |
|
45 |
|
46 echo '<h4>'. __( 'Choices', 'option-tree' ) . ':</h4>'; |
|
47 echo '<p>' . __( 'Click the "Add Choice" button to add an item to the choices array. This will only affect the following option types: Checkbox, Radio, Select & Select Image.', 'option-tree' ) . '</p>'; |
|
48 |
|
49 echo '<h4>'. __( 'Settings', 'option-tree' ) . ':</h4>'; |
|
50 echo '<p>' . __( 'Click the "Add Setting" button found inside a newly created setting to add an item to the settings array. This will only affect the List Item type.', 'option-tree' ) . '</p>'; |
|
51 |
|
52 echo '<h4>'. __( 'Standard', 'option-tree' ) . ':</h4>'; |
|
53 echo '<p>' . __( 'Setting the standard value for your option only works for some option types. Those types are one that have a single string value saved to them and not an array of values.', 'option-tree' ) . '</p>'; |
|
54 |
|
55 echo '<h4>'. __( 'Rows', 'option-tree' ) . ':</h4>'; |
|
56 echo '<p>' . __( 'Enter a numeric value for the number of rows in your textarea. This will only affect the following option types: CSS, Textarea, & Textarea Simple.', 'option-tree' ) . '</p>'; |
|
57 |
|
58 echo '<h4>'. __( 'Post Type', 'option-tree' ) . ':</h4>'; |
|
59 echo '<p>' . __( 'Add a comma separated list of post type like <code>post,page</code>. This will only affect the following option types: Custom Post Type Checkbox, & Custom Post Type Select. Below are the default post types available with WordPress and that are also compatible with OptionTree. You can also add your own custom <code>post_type</code>. At this time <code>any</code> does not seem to return results properly and is something I plan on looking into.', 'option-tree' ) . '</p>'; |
|
60 |
|
61 echo '<ul class="docs-ul">'; |
|
62 echo '<li><code>post</code></li>'; |
|
63 echo '<li><code>page</code></li>'; |
|
64 echo '<li><code>attachment</code></li>'; |
|
65 echo '</ul>'; |
|
66 |
|
67 echo '<h4>'. __( 'Taxonomy', 'option-tree' ) . ':</h4>'; |
|
68 echo '<p>' . __( 'Add a comma separated list of any registered taxonomy like <code>category,post_tag</code>. This will only affect the following option types: Taxonomy Checkbox, & Taxonomy Select.', 'option-tree' ) . '</p>'; |
|
69 |
|
70 echo '</div>'; |
|
71 |
|
72 echo '</div>'; |
|
73 |
|
74 } |
|
75 |
|
76 } |
|
77 |
|
78 /** |
|
79 * ot_get_option() option type. |
|
80 * |
|
81 * This is a callback function to display text about ot_get_option(). |
|
82 * |
|
83 * @return string |
|
84 * |
|
85 * @access public |
|
86 * @since 2.0 |
|
87 */ |
|
88 if ( ! function_exists( 'ot_type_option_types' ) ) { |
|
89 |
|
90 function ot_type_option_types() { |
|
91 |
|
92 /* format setting outer wrapper */ |
|
93 echo '<div class="format-setting type-textblock wide-desc">'; |
|
94 |
|
95 /* description */ |
|
96 echo '<div class="description">'; |
|
97 |
|
98 echo '<h4>'. __( 'Background', 'option-tree' ) . ':</h4>'; |
|
99 echo '<p>' . __( 'The Background option type is for adding background styles to your theme either dynamically via the CSS option type below or manually with <code>ot_get_option()</code>. Background has filters that allow you to change the defaults. For example, you can filter on <code>ot_recognized_background_repeat</code>, <code>ot_recognized_background_attachment</code>, and <code>ot_recognized_background_position</code>. These filters allow you to fine tune the select lists for your specific CSS needs.', 'option-tree' ) . '</p>'; |
|
100 |
|
101 echo '<h4>'. __( 'Category Select', 'option-tree' ) . ':</h4>'; |
|
102 echo '<p>' . __( 'The Category Select option type displays a list of category IDs. It allows the user to select only one category ID and will return that value for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
103 |
|
104 echo '<h4>'. __( 'Category Checkbox', 'option-tree' ) . ':</h4>'; |
|
105 echo '<p>' . __( 'The Category Checkbox option type displays a list of category IDs. It allows the user to check multiple category IDs and will return that value as an array for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
106 |
|
107 echo '<h4>'. __( 'Checkbox', 'option-tree' ) . ':</h4>'; |
|
108 echo '<p>' . __( 'The Checkbox option type is fairly self explanatory. Typically used to ask questions. For example, "Do you want to activate asynchronous Google analytics?" would be a single checkbox with a value of yes. You could have more complex usages but the idea is that you can easily grab the value of the checkbox and use it in you theme. In this situation you would test if the checkbox has a value and execute a block of code if it does and do nothing if it doesn\'t.', 'option-tree' ) . '</p>'; |
|
109 |
|
110 echo '<h4>'. __( 'Colorpicker', 'option-tree' ) . ':</h4>'; |
|
111 echo '<p>' . __( 'The Colorpicker option type saves a hexadecimal color code for use in CSS. Use it to modify the color of something in your theme.', 'option-tree' ) . '</p>'; |
|
112 |
|
113 echo '<h4>'. __( 'CSS', 'option-tree' ) . ':</h4>'; |
|
114 echo '<p>' . __( 'The CSS option type is a textarea that when used properly can add dynamic CSS to your theme from within OptionTree. Unfortunately, due server limitations you will need to create a file named <code>dynamic.css</code> at the root level of your theme and change permissions using chmod so the server can write to the file. I have had the most success setting this single file to 0777 but feel free to play around with permissions until everything is working. A good starting point is 0666. When the server can save to the file CSS will automatically be updated each time you save your theme options.', 'option-tree' ) . '</p>'; |
|
115 |
|
116 echo '<p class="aside">' . __( 'An example of the CSS option type: This assumes you have an option with the ID of <code>custom_background_css</code> which will display the saved values for that option.', 'option-tree' ) . '</p>'; |
|
117 |
|
118 echo '<p>'. __( 'Input', 'option-tree' ) . ':</p>'; |
|
119 echo '<pre><code>body { |
|
120 {{custom_background_css}} |
|
121 background-color: {{custom_background_css|background-color}}; |
|
122 }</code></pre>'; |
|
123 |
|
124 echo '<p>'. __( 'Output', 'option-tree' ) . ':</p>'; |
|
125 echo '<pre><code>/* BEGIN custom_background_css */ |
|
126 body { |
|
127 background: color image repeat attachment position; |
|
128 background-color: color; |
|
129 } |
|
130 /* END custom_background_css */</code></pre>'; |
|
131 |
|
132 echo '<h4>'. __( 'Custom Post Type Select', 'option-tree' ) . ':</h4>'; |
|
133 echo '<p>' . __( 'The Custom Post Type Select option type displays a list of IDs from any available WordPress post type or custom post type. It will return a single post ID for use in a custom function or loop. Requires at least one valid <code>post_type</code> when created in the settings. For some reason <code>any</code> does not work correctly and will looked into in future version.', 'option-tree' ) . '</p>'; |
|
134 |
|
135 echo '<h4>'. __( 'Custom Post Type Checkbox', 'option-tree' ) . ':</h4>'; |
|
136 echo '<p>' . __( 'The Custom Post Type Select option type displays a list of IDs from any available WordPress post type or custom post type. It allows the user to check multiple post IDs for use in a custom function or loop. Requires at least one valid <code>post_type</code> when created in the settings. For some reason <code>any</code> does not work correctly and will looked into in future version.', 'option-tree' ) . '</p>'; |
|
137 |
|
138 echo '<h4>'. __( 'List Item', 'option-tree' ) . ':</h4>'; |
|
139 echo '<p>' . __( 'The list Item replaced the old Slider option type. It allows for a great deal of customization. You can add settings to the List Item and those settings will be displayed to the user when they add a new List Item. Typical use is for creating sliding content or blocks of code for custom layouts.', 'option-tree' ) . '</p>'; |
|
140 |
|
141 echo '<h4>'. __( 'Measurement', 'option-tree' ) . ':</h4>'; |
|
142 echo '<p>' . __( 'The Measurement option type is a mix of input and select fields. The text input excepts a value and the select lets you choose the unit of measurement to add to that value. Currently the default units are <code>px</code>, <code>%</code>, <code>em</code>, <code>pt</code>. However, you can change them with the <code>ot_measurement_unit_types</code> filter.', 'option-tree' ) . '</p>'; |
|
143 |
|
144 echo '<p>' . __( 'Example filter to add new units to the Measurement option type. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
145 echo '<pre><code>function filter_measurement_unit_types( $array, $field_id ) { |
|
146 |
|
147 /* only run the filter on measurement with a field ID of my_measurement */ |
|
148 if ( $field_id == \'my_measurement\' ) { |
|
149 $array[\'in\'] = \'inches\'; |
|
150 $array[\'ft\'] = \'feet\'; |
|
151 } |
|
152 |
|
153 return $array; |
|
154 } |
|
155 add_filter( \'ot_measurement_unit_types\', \'filter_measurement_unit_types\', 10, 2 );</code></pre>'; |
|
156 |
|
157 echo '<p>' . __( 'Example filter to completely change the units in the Measurement option type. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
158 echo '<pre><code>function filter_measurement_unit_types( $array, $field_id ) { |
|
159 |
|
160 /* only run the filter on measurement with a field ID of my_measurement */ |
|
161 if ( $field_id == \'my_measurement\' ) { |
|
162 $array = array( |
|
163 \'in\' => \'inches\', |
|
164 \'ft\' => \'feet\' |
|
165 ); |
|
166 } |
|
167 |
|
168 return $array; |
|
169 } |
|
170 add_filter( \'ot_measurement_unit_types\', \'filter_measurement_unit_types\', 10, 2 );</code></pre>'; |
|
171 |
|
172 echo '<h4>'. __( 'Page Select', 'option-tree' ) . ':</h4>'; |
|
173 echo '<p>' . __( 'The Page Select option type displays a list of page IDs. It will return a single page ID for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
174 |
|
175 echo '<h4>'. __( 'Page Checkbox', 'option-tree' ) . ':</h4>'; |
|
176 echo '<p>' . __( 'The Page Select option type displays a list of page IDs. It allows the user to check multiple page IDs for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
177 |
|
178 echo '<h4>'. __( 'Post Select', 'option-tree' ) . ':</h4>'; |
|
179 echo '<p>' . __( 'The Post Select option type displays a list of post IDs. It will return a single post ID for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
180 |
|
181 echo '<h4>'. __( 'Post Checkbox', 'option-tree' ) . ':</h4>'; |
|
182 echo '<p>' . __( 'The Post Select option type displays a list of post IDs. It allows the user to check multiple post IDs for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
183 |
|
184 echo '<h4>'. __( 'Radio', 'option-tree' ) . ':</h4>'; |
|
185 echo '<p>' . __( 'The Radio option type could ask a question. For example, "Do you want to activate the custom navigation?" could require a yes or no answer with a radio option. In this situation you would test if the radio has a value of \'yes\' and execute a block of code, or if it\'s \'no\' execute a different block of code.', 'option-tree' ) . '</p>'; |
|
186 |
|
187 echo '<h4>'. __( 'Radio Image', 'option-tree' ) . ':</h4>'; |
|
188 echo '<p>' . __( 'the Radio Images option type is primarily used for layouts. However, you can filter the image list using <code>ot_radio_images</code>. As well, you can add your own custom images using the choices array.', 'option-tree' ) . '</p>'; |
|
189 |
|
190 echo '<p>' . __( 'This example executes the <code>ot_radio_images</code> filter on layout images attached to the <code>my_radio_images</code> field. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
191 echo '<pre><code>function filter_radio_images( $array, $field_id ) { |
|
192 |
|
193 /* only run the filter where the field ID is my_radio_images */ |
|
194 if ( $field_id == \'my_radio_images\' ) { |
|
195 $array = array( |
|
196 array( |
|
197 \'value\' => \'left-sidebar\', |
|
198 \'label\' => __( \'Left Sidebar\', \'option-tree\' ), |
|
199 \'src\' => OT_URL . \'/assets/images/layout/left-sidebar.png\' |
|
200 ), |
|
201 array( |
|
202 \'value\' => \'right-sidebar\', |
|
203 \'label\' => __( \'Right Sidebar\', \'option-tree\' ), |
|
204 \'src\' => OT_URL . \'/assets/images/layout/right-sidebar.png\' |
|
205 ) |
|
206 ); |
|
207 } |
|
208 |
|
209 return $array; |
|
210 |
|
211 } |
|
212 add_filter( \'ot_radio_images\', \'filter_radio_images\', 10, 2 );</code></pre>'; |
|
213 |
|
214 echo '<h4>'. __( 'Select', 'option-tree' ) . ':</h4>'; |
|
215 echo '<p>' . __( 'The Select option type is used to list anything you want that would be chosen from a select list.', 'option-tree' ) . '</p>'; |
|
216 |
|
217 echo '<h4>'. __( 'Slider', 'option-tree' ) . ':</h4>'; |
|
218 echo '<p>' . __( 'The Slider option type is technically deprecated. Use the List Item option type instead, as it\'s infinitely more customizable. Typical use is for creating sliding image content.', 'option-tree' ) . '</p>'; |
|
219 |
|
220 echo '<h4>'. __( 'Tag Checkbox', 'option-tree' ) . ':</h4>'; |
|
221 echo '<p>' . __( 'The Tag Checkbox option type displays a list of tag IDs. It allows the user to check multiple tag IDs and will return that value as an array for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
222 |
|
223 echo '<h4>'. __( 'Tag Select', 'option-tree' ) . ':</h4>'; |
|
224 echo '<p>' . __( 'The Tag Select option type displays a list of tag IDs. It allows the user to select only one tag ID and will return that value for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
225 |
|
226 echo '<h4>'. __( 'Taxonomy Checkbox', 'option-tree' ) . ':</h4>'; |
|
227 echo '<p>' . __( 'The Taxonomy Checkbox option type displays a list of taxonomy IDs. It allows the user to check multiple taxonomy IDs and will return that value as an array for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
228 |
|
229 echo '<h4>'. __( 'Taxonomy Select', 'option-tree' ) . ':</h4>'; |
|
230 echo '<p>' . __( 'The Taxonomy Select option type displays a list of taxonomy IDs. It allows the user to select only one taxonomy ID and will return that value for use in a custom function or loop.', 'option-tree' ) . '</p>'; |
|
231 |
|
232 echo '<h4>'. __( 'Text (Input)', 'option-tree' ) . ':</h4>'; |
|
233 echo '<p>' . __( 'The Text option type would be used to save a string value. For example, a link to feedburner, your Twitter username, or Google Analytics ID are all good candidates. Any optional or required text that is of reasonably short character length.', 'option-tree' ) . '</p>'; |
|
234 |
|
235 echo '<h4>'. __( 'Textarea', 'option-tree' ) . ':</h4>'; |
|
236 echo '<p>' . __( 'The Textarea option type is a large string value used for custom code or text in the theme. The new Textarea has a WYSIWYG editor that can be filtered to change the buttons shown. For example, you can filter on <code>wpautop</code>, <code>media_buttons</code>, <code>tinymce</code>, and <code>quicktags</code>.', 'option-tree' ) . '</p>'; |
|
237 |
|
238 echo '<p class="aside">' . __( 'Example filters to alter the Textarea option type. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
239 |
|
240 echo '<p>' . __( 'This example keeps WordPress from executing the <code>wpautop</code> filter on the line breaks. The default is <code>true</code> which means it wraps line breaks with an HTML <code>p</code> tag.', 'option-tree' ) . '</p>'; |
|
241 echo '<pre><code>function filter_textarea_wpautop( $content, $field_id ) { |
|
242 |
|
243 /* only run the filter on the textarea with a field ID of my_textarea */ |
|
244 if ( $field_id == \'my_textarea\' ) { |
|
245 return false; |
|
246 } |
|
247 |
|
248 return $content; |
|
249 |
|
250 } |
|
251 add_filter( \'ot_wpautop\', \'filter_textarea_wpautop\', 10, 1 );</code></pre>'; |
|
252 |
|
253 echo '<p>' . __( 'This example keeps WordPress from executing the <code>media_buttons</code> filter on the textarea WYSIWYG. The default is <code>true</code> which means show the buttons.', 'option-tree' ) . '</p>'; |
|
254 echo '<pre><code>function filter_textarea_media_buttons( $content, $field_id ) { |
|
255 |
|
256 /* only run the filter on the textarea with a field ID of my_textarea */ |
|
257 if ( $field_id == \'my_textarea\' ) { |
|
258 return false; |
|
259 } |
|
260 |
|
261 return $content; |
|
262 |
|
263 } |
|
264 add_filter( \'ot_media_buttons\', \'filter_textarea_media_buttons\', 10, 2 );</code></pre>'; |
|
265 |
|
266 echo '<p>' . __( 'This example keeps WordPress from executing the <code>tinymce</code> filter on the textarea WYSIWYG. The default is <code>true</code> which means show the tinymce.', 'option-tree' ) . '</p>'; |
|
267 echo '<pre><code>function filter_textarea_tinymce( $content, $field_id ) { |
|
268 |
|
269 /* only run the filter on the textarea with a field ID of my_textarea */ |
|
270 if ( $field_id == \'my_textarea\' ) { |
|
271 return false; |
|
272 } |
|
273 |
|
274 return $content; |
|
275 |
|
276 } |
|
277 add_filter( \'ot_tinymce\', \'filter_textarea_tinymce\', 10, 2 );</code></pre>'; |
|
278 |
|
279 echo '<p>' . __( 'This example alters the <code>quicktags</code> filter on the textarea WYSIWYG. The default is <code>array( \'buttons\' => \'strong,em,link,block,del,ins,img,ul,ol,li,code,spell,close\' )</code> which means show those quicktags. It also means you can filter in your own custom quicktags.', 'option-tree' ) . '</p>'; |
|
280 echo '<pre><code>function filter_textarea_quicktags( $content, $field_id ) { |
|
281 |
|
282 /* only run the filter on the textarea with a field ID of my_textarea */ |
|
283 if ( $field_id == \'my_textarea\' ) { |
|
284 return array( \'buttons\' => \'strong,em,link,block,del,ins,img,ul,ol,li,code,more,spell,close,fullscreen\' ); |
|
285 } else if ( $field_id == \'my_other_textarea\' ) { |
|
286 return false; /* show no quicktags */ |
|
287 } |
|
288 |
|
289 return $content; |
|
290 |
|
291 } |
|
292 add_filter( \'ot_quicktags\', \'filter_textarea_quicktags\', 10, 1 );</code></pre>'; |
|
293 |
|
294 echo '<h4>'. __( 'Textarea Simple', 'option-tree' ) . ':</h4>'; |
|
295 echo '<p>' . __( 'The Textarea Simple option type is a large string value used for custom code or text in the theme. The new Textarea Simple does not have a WYSIWYG editor. But you can still filter on <code>wpautop</code>.', 'option-tree' ) . '</p>'; |
|
296 |
|
297 echo '<p class="aside">' . __( 'This example tells WordPress to execute the <code>wpautop</code> filter on the line breaks. The default is <code>false</code> which means it does not wraps line breaks with an HTML <code>p</code> tag. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
298 echo '<pre><code>function filter_textarea_simple_wpautop( $content, $field_id ) { |
|
299 |
|
300 /* only run the filter on the textarea with a field ID of my_textarea */ |
|
301 if ( $field_id == \'my_textarea\' ) { |
|
302 return true; |
|
303 } |
|
304 |
|
305 return $content; |
|
306 |
|
307 } |
|
308 add_filter( \'ot_wpautop\', \'filter_textarea_simple_wpautop\', 10, 2 );</code></pre>'; |
|
309 |
|
310 echo '<h4>'. __( 'Textblock', 'option-tree' ) . ':</h4>'; |
|
311 echo '<p>' . __( 'The Textblock option type is used only on the Theme Option page. It will allow you to create & display HTML on your Theme Options page but has no title above the text block. You can then use the Textblock to add a more detailed set of instruction on how the options are used in your theme. You would NEVER use this in your themes template files as it does not save a value.', 'option-tree' ) . '</p>'; |
|
312 |
|
313 echo '<h4>'. __( 'Textblock Titled', 'option-tree' ) . ':</h4>'; |
|
314 echo '<p>' . __( 'The Textblock Titled option type is used only on the Theme Option page. It will allow you to create & display HTML on your Theme Options page and has a title above the text block. You can then use the Textblock Titled to add a more detailed set of instruction on how the options are used in your theme. You would NEVER use this in your themes template files as it does not save a value.', 'option-tree' ) . '</p>'; |
|
315 |
|
316 echo '<h4>'. __( 'Typography', 'option-tree' ) . ':</h4>'; |
|
317 echo '<p>' . __( 'The Typography option type is for adding typographic styles to your theme either dynamically via the CSS option type below or manually with <code>ot_get_option()</code>. Typography has filters that allow you to change the defaults. For example, you can filter on <code>ot_recognized_font_styles</code>, <code>ot_recognized_font_weights</code>, <code>ot_recognized_font_variants</code>, and <code>ot_recognized_font_families</code>. These filters allow you to fine tune the select lists for your specific CSS needs. The most important one though is <code>ot_recognized_font_families</code> as you can add your Google Fonts to create custom font stacks.', 'option-tree' ) . '</p>'; |
|
318 |
|
319 echo '<p class="aside">' . __( 'This example would filter <code>ot_recognized_font_families</code> to build your own font stack. Added to <code>functions.php</code>.', 'option-tree' ) . '</p>'; |
|
320 echo '<pre><code>function filter_ot_recognized_font_families( $array, $field_id ) { |
|
321 |
|
322 /* only run the filter when the field ID is my_google_fonts_headings */ |
|
323 if ( $field_id == \'my_google_fonts_headings\' ) { |
|
324 $array = array( |
|
325 \'sans-serif\' => \'sans-serif\', |
|
326 \'open-sans\' => \'"Open Sans", sans-serif\', |
|
327 \'droid-sans\' => \'"Droid Sans", sans-serif\' |
|
328 ); |
|
329 } |
|
330 |
|
331 return $array; |
|
332 |
|
333 } |
|
334 add_filter( \'ot_recognized_font_families\', \'filter_ot_recognized_font_families\', 10, 2 );</code></pre>'; |
|
335 |
|
336 echo '<h4>'. __( 'Upload', 'option-tree' ) . ':</h4>'; |
|
337 echo '<p>' . __( 'The Upload option type is used to upload any WordPress supported media. After uploading, users are required to press the "Send to OptionTree" button in order to populate the input with the URI of that media. There is one caveat of this feature. If you import the theme options and have uploaded media on one site the old URI will not reflect the URI of your new site. You\'ll have to re-upload or FTP any media to your new server and change the URIs if necessary.', 'option-tree' ) . '</p>'; |
|
338 |
|
339 echo '</div>'; |
|
340 |
|
341 echo '</div>'; |
|
342 |
|
343 } |
|
344 |
|
345 } |
|
346 |
|
347 /** |
|
348 * ot_get_option() option type. |
|
349 * |
|
350 * This is a callback function to display text about ot_get_option(). |
|
351 * |
|
352 * @return string |
|
353 * |
|
354 * @access public |
|
355 * @since 2.0 |
|
356 */ |
|
357 if ( ! function_exists( 'ot_type_ot_get_option' ) ) { |
|
358 |
|
359 function ot_type_ot_get_option() { |
|
360 |
|
361 /* format setting outer wrapper */ |
|
362 echo '<div class="format-setting type-textblock wide-desc">'; |
|
363 |
|
364 /* description */ |
|
365 echo '<div class="description">'; |
|
366 |
|
367 echo '<h4>'. __( 'Description', 'option-tree' ) . ':</h4>'; |
|
368 |
|
369 echo '<p>' . __( 'This function returns a value from the "option_tree" array of saved values or the default value supplied. The returned value would be mixed. Meaning it could be a string, integer, boolean, or array.', 'option-tree' ) . '</p>'; |
|
370 |
|
371 echo '<h4>' . __( 'Usage', 'option-tree' ) . ':</h4>'; |
|
372 |
|
373 echo '<p><code><?php ot_get_option( $option_id, $default ); ?></code></p>'; |
|
374 |
|
375 echo '<h4>' . __( 'Parameters', 'option-tree' ) . ':</h4>'; |
|
376 |
|
377 echo '<code>$option_id</code>'; |
|
378 |
|
379 echo '<p>(<em>' . __( 'string', 'option-tree' ) . '</em>) (<em>' . __( 'required', 'option-tree' ) . '</em>) ' . __( 'Enter the options unique identifier.', 'option-tree' ) . '<br />' . __( 'Default:', 'option-tree' ) . ' <em>' . __( 'None', 'option-tree' ) . '</em></p>'; |
|
380 |
|
381 echo '<code>$default</code>'; |
|
382 |
|
383 echo '<p>(<em>' . __( 'string', 'option-tree' ) . '</em>) (<em>' . __( 'optional', 'option-tree' ) . '</em>) ' . __( 'Enter a default return value. This is just incase the request returns null.', 'option-tree' ) . '<br />' . __( 'Default', 'option-tree' ) . ': <em>' . __( 'None', 'option-tree' ) . '</em></p>'; |
|
384 |
|
385 echo '</div>'; |
|
386 |
|
387 echo '</div>'; |
|
388 |
|
389 } |
|
390 |
|
391 } |
|
392 |
|
393 /** |
|
394 * get_option_tree() option type. |
|
395 * |
|
396 * This is a callback function to display text about get_option_tree(). |
|
397 * |
|
398 * @return string |
|
399 * |
|
400 * @access public |
|
401 * @since 2.0 |
|
402 */ |
|
403 if ( ! function_exists( 'ot_type_get_option_tree' ) ) { |
|
404 |
|
405 function ot_type_get_option_tree() { |
|
406 |
|
407 /* format setting outer wrapper */ |
|
408 echo '<div class="format-setting type-textblock wide-desc">'; |
|
409 |
|
410 /* description */ |
|
411 echo '<div class="description">'; |
|
412 |
|
413 echo '<p class="deprecated">' . __( 'This function has been deprecated. That means it has been replaced by a new function or is no longer supported, and may be removed from future versions. All code that uses this function should be converted to use its replacement.', 'option-tree' ) . '</p>'; |
|
414 |
|
415 echo '<p>' . __( 'Use', 'option-tree' ) . '<code>ot_get_option()</code>' . __( 'instead', 'option-tree' ) . '.</p>'; |
|
416 |
|
417 echo '<h4>'. __( 'Description', 'option-tree' ) . ':</h4>'; |
|
418 |
|
419 echo '<p>' . __( 'This function returns, or echos if asked, a value from the "option_tree" array of saved values.', 'option-tree' ) . '</p>'; |
|
420 |
|
421 echo '<h4>' . __( 'Usage', 'option-tree' ) . ':</h4>'; |
|
422 |
|
423 echo '<p><code><?php get_option_tree( $item_id, $options, $echo, $is_array, $offset ); ?></code></p>'; |
|
424 |
|
425 echo '<h4>' . __( 'Parameters', 'option-tree' ) . ':</h4>'; |
|
426 |
|
427 echo '<code>$item_id</code>'; |
|
428 |
|
429 echo '<p>(<em>' . __( 'string', 'option-tree' ) . '</em>) (<em>' . __( 'required', 'option-tree' ) . '</em>) ' . __( 'Enter a unique Option Key to get a returned value or array.', 'option-tree' ) . '<br />' . __( 'Default:', 'option-tree' ) . ' <em>' . __( 'None', 'option-tree' ) . '</em></p>'; |
|
430 |
|
431 echo '<code>$options</code>'; |
|
432 |
|
433 echo '<p>(<em>' . __( 'array', 'option-tree' ) . '</em>) (<em>' . __( 'optional', 'option-tree' ) . '</em>) ' . __( 'Used to cut down on database queries in template files.', 'option-tree' ) . '<br />' . __( 'Default', 'option-tree' ) . ': <em>' . __( 'None', 'option-tree' ) . '</em></p>'; |
|
434 |
|
435 echo '<code>$echo</code>'; |
|
436 |
|
437 echo '<p>(<em>' . __( 'boolean', 'option-tree' ) . '</em>) (<em>' . __( 'optional', 'option-tree' ) . '</em>) ' . __( 'Echo the output.', 'option-tree' ) . '<br />' . __( 'Default', 'option-tree' ) . ': FALSE</p>'; |
|
438 |
|
439 echo '<code>$is_array</code>'; |
|
440 |
|
441 echo '<p>(<em>' . __( 'boolean', 'option-tree' ) . '</em>) (<em>' . __( 'optional', 'option-tree' ) . '</em>) ' . __( 'Used to indicate the $item_id is an array of values.', 'option-tree' ) . '<br />' . __( 'Default', 'option-tree' ) . ': FALSE</p>'; |
|
442 |
|
443 echo '<code>$offset</code>'; |
|
444 |
|
445 echo '<p>(<em>' . __( 'integer', 'option-tree' ) . '</em>) (<em>' . __( 'optional', 'option-tree' ) . '</em>) ' . __( 'Numeric offset key for the $item_id array, -1 will return all values (an array starts at 0).', 'option-tree' ) . '<br />' . __( 'Default', 'option-tree' ) . ': -1</p>'; |
|
446 |
|
447 echo '</div>'; |
|
448 |
|
449 echo '</div>'; |
|
450 |
|
451 } |
|
452 |
|
453 } |
|
454 |
|
455 /** |
|
456 * Examples option type. |
|
457 * |
|
458 * @return string |
|
459 * |
|
460 * @access public |
|
461 * @since 2.0 |
|
462 */ |
|
463 if ( ! function_exists( 'ot_type_examples' ) ) { |
|
464 |
|
465 function ot_type_examples() { |
|
466 |
|
467 /* format setting outer wrapper */ |
|
468 echo '<div class="format-setting type-textblock wide-desc">'; |
|
469 |
|
470 /* description */ |
|
471 echo '<div class="description">'; |
|
472 |
|
473 echo '<p class="aside">' . __( 'If you\'re using the plugin version of OptionTree it is highly recommended to include a <code>function_exists</code> check in your code, as described in the examples below. If you\'ve integrated OptionTree directly into your themes root directory, you will <strong>not</strong> need to wrap your code with <code>function_exists</code>, as you\'re guaranteed to have the <code>ot_get_option()</code> function available.', 'option-tree' ) . '</p>'; |
|
474 |
|
475 echo '<h4>' . __( 'String Examples', 'option-tree' ) . ':</h4>'; |
|
476 |
|
477 echo '<p>' . __( 'Returns the value of <code>test_input</code>.', 'option-tree' ) . '</p>'; |
|
478 |
|
479 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
480 $test_input = ot_get_option( \'test_input\' ); |
|
481 }</code></pre>'; |
|
482 |
|
483 echo '<p>' . __( 'Returns the value of <code>test_input</code>, but also has a default value if it returns empty.', 'option-tree' ) . '</p>'; |
|
484 |
|
485 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
486 $test_input = ot_get_option( \'test_input\', \'default input value goes here.\' ); |
|
487 }</code></pre>'; |
|
488 |
|
489 echo '<h4>' . __( 'Array Examples', 'option-tree' ) . ':</h4>'; |
|
490 |
|
491 echo '<p>' . __( 'Assigns the value of <code>navigation_ids</code> to the variable <code>$ids</code>. It then echos an unordered list of links (navigation) using <code>wp_list_pages()</code>.', 'option-tree' ) . '</p>'; |
|
492 |
|
493 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
494 /* get an array of page id\'s */ |
|
495 $ids = ot_get_option( \'navigation_ids\', array() ); |
|
496 |
|
497 /* echo custom navigation using wp_list_pages() */ |
|
498 if ( ! empty( $ids ) ) |
|
499 echo \'<ul>\'; |
|
500 wp_list_pages( |
|
501 array( |
|
502 \'include\' => $ids, |
|
503 \'title_li\' => \'\' |
|
504 ) |
|
505 ); |
|
506 echo \'</ul>\'; |
|
507 } |
|
508 |
|
509 }</code></pre>'; |
|
510 |
|
511 echo '<p>' . __( 'The next two examples demonstrate how to use the <strong>Measurement</strong> option type. The Measurement option type is an array with two key/value pairs. The first is the value of measurement and the second is the unit of measurement.', 'option-tree' ) . '</p>'; |
|
512 |
|
513 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
514 /* get the array */ |
|
515 $measurement = ot_get_option( \'measurement_option_type_id\' ); |
|
516 |
|
517 /* only echo values if they actually exist, else echo some default value */ |
|
518 if ( isset( measurement[0] ) && $measurement[1] ) { |
|
519 echo $measurement[0].$measurement[1]; |
|
520 } else { |
|
521 echo \'10px\'; |
|
522 } |
|
523 |
|
524 }</code></pre>'; |
|
525 |
|
526 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
527 /* get the array, and have a default just incase */ |
|
528 $measurement = ot_get_option( \'measurement_option_type_id\', array( \'10\', \'px\' ) ); |
|
529 |
|
530 /* implode array into a string value */ |
|
531 if ( ! empty( measurement ) ) { |
|
532 echo implode( \'\', $measurement ); |
|
533 } |
|
534 |
|
535 }</code></pre>'; |
|
536 |
|
537 echo '<p>' . __( 'This example displays a very basic slider loop.', 'option-tree' ) . '</p>'; |
|
538 |
|
539 echo '<pre><code>if ( function_exists( \'ot_get_option\' ) ) { |
|
540 |
|
541 /* get the slider array */ |
|
542 $slides = ot_get_option( \'my_slider\', array() ); |
|
543 |
|
544 if ( ! empty( $slides ) ) { |
|
545 foreach( $slides as $slide ) { |
|
546 echo \' |
|
547 <li> |
|
548 <a href="\' . $slide[\'link\'] . \'"><img src="\' . $slide[\'image\'] . \'" alt="\' . $slide[\'title\'] . \'" /></a> |
|
549 <div class="description">\' . $slide[\'description\'] . \'</div> |
|
550 </li>\'; |
|
551 } |
|
552 } |
|
553 |
|
554 }</code></pre>'; |
|
555 |
|
556 echo '</div>'; |
|
557 |
|
558 echo '</div>'; |
|
559 |
|
560 } |
|
561 |
|
562 } |
|
563 |
|
564 /** |
|
565 * Layouts Overview option type. |
|
566 * |
|
567 * @return string |
|
568 * |
|
569 * @access public |
|
570 * @since 2.0 |
|
571 */ |
|
572 if ( ! function_exists( 'ot_type_layouts_overview' ) ) { |
|
573 |
|
574 function ot_type_layouts_overview() { |
|
575 |
|
576 /* format setting outer wrapper */ |
|
577 echo '<div class="format-setting type-textblock wide-desc">'; |
|
578 |
|
579 /* description */ |
|
580 echo '<div class="description">'; |
|
581 |
|
582 echo '<h4>'. __( 'It\'s Super Simple', 'option-tree' ) . '</h4>'; |
|
583 |
|
584 echo '<p>' . __( 'Layouts make your theme awesome! With theme options data that you can save/import/export you can package themes with different color variations, or make it easy to do A/B testing on text and so much more. Basically, you save a snapshot of your data as a layout.', 'option-tree' ) . '</p>'; |
|
585 |
|
586 echo '<p>' . __( 'Once you have created all your different layouts, or theme variations, you can save them to a separate text file for repackaging with your theme. Alternatively, you could just make different variations for yourself and change your theme with the click of a button, all without deleting your previous options data.', 'option-tree' ) . '</p>'; |
|
587 |
|
588 echo '<p class="aside">' . __( ' Adding a layout is ridiculously easy, follow these steps and you\'ll be on your way to having a WordPress super theme.', 'option-tree' ) . '</p>'; |
|
589 |
|
590 echo '<h4>' . __( 'For Developers', 'option-tree' ) . ':</h4>'; |
|
591 echo '<p>' . __( '', 'option-tree' ) . '</p>'; |
|
592 |
|
593 echo '<h5>' . __( 'Creating a Layout', 'option-tree' ) . ':</h5>'; |
|
594 echo '<ul class="docs-ul">'; |
|
595 echo '<li>'. __( 'Go to the <code>OptionTre->Settings->Layouts</code> tab.', 'option-tree' ) . '</li>'; |
|
596 echo '<li>' . __( 'Enter a name for your layout in the text field and hit "Save Layouts", you\'ve created your first layout.', 'option-tree' ) . '</li>'; |
|
597 echo '<li>' . __( 'Adding a new layout is as easy as repeating the steps above.', 'option-tree' ) . '</li>'; |
|
598 echo '</ul>'; |
|
599 |
|
600 echo '<h5>' . __( 'Activating a Layout', 'option-tree' ) . ':</h5>'; |
|
601 echo '<ul class="docs-ul">'; |
|
602 echo '<li>'. __( 'Go to the <code>OptionTre->Settings->Layouts</code> tab.', 'option-tree' ) . '</li>'; |
|
603 echo '<li>' . __( 'Click on the activate layout button in the actions list.', 'option-tree' ) . '</li>'; |
|
604 echo '</ul>'; |
|
605 |
|
606 echo '<h5>' . __( 'Deleting a Layout', 'option-tree' ) . ':</h5>'; |
|
607 echo '<ul class="docs-ul">'; |
|
608 echo '<li>'. __( 'Go to the <code>OptionTre->Settings->Layouts</code> tab.', 'option-tree' ) . '</li>'; |
|
609 echo '<li>' . __( 'Click on the delete layout button in the actions list.', 'option-tree' ) . '</li>'; |
|
610 echo '</ul>'; |
|
611 |
|
612 echo '<h5>' . __( 'Edit Layout Data', 'option-tree' ) . ':</h5>'; |
|
613 echo '<ul class="docs-ul">'; |
|
614 echo '<li>'. __( 'Go to the <code>Appearance->Theme Options</code> page.', 'option-tree' ) . '</li>'; |
|
615 echo '<li>' . __( 'Modify and save your theme options and the layout will be updated automatically.', 'option-tree' ) . '</li>'; |
|
616 echo '<li>' . __( 'Saving theme options data will update the currently active layout, so before you start saving make sure you want to modify the current layout.', 'option-tree' ) . '</li>'; |
|
617 echo '<li>' . __( 'If you want to edit a new layout, first create it then save your theme options.', 'option-tree' ) . '</li>'; |
|
618 echo '</ul>'; |
|
619 |
|
620 echo '<h4>' . __( 'End-Users Mode', 'option-tree' ) . ':</h4>'; |
|
621 echo '<p>' . __( '', 'option-tree' ) . '</p>'; |
|
622 |
|
623 echo '<h5>' . __( 'Creating a Layout', 'option-tree' ) . ':</h5>'; |
|
624 echo '<ul class="docs-ul">'; |
|
625 echo '<li>'. __( 'Go to the <code>Appearance->Theme Options</code> page.', 'option-tree' ) . '</li>'; |
|
626 echo '<li>' . __( 'Enter a name for your layout in the text field and hit "New Layout", you\'ve created your first layout.', 'option-tree' ) . '</li>'; |
|
627 echo '<li>' . __( 'Adding a new layout is as easy as repeating the steps above.', 'option-tree' ) . '</li>'; |
|
628 echo '</ul>'; |
|
629 |
|
630 echo '<h5>' . __( 'Activating a Layout', 'option-tree' ) . ':</h5>'; |
|
631 echo '<ul class="docs-ul">'; |
|
632 echo '<li>'. __( 'Go to the <code>Appearance->Theme Options</code> page.', 'option-tree' ) . '</li>'; |
|
633 echo '<li>' . __( 'Choose a layout from the select list and click the "Activate Layout" button.', 'option-tree' ) . '</li>'; |
|
634 echo '</ul>'; |
|
635 |
|
636 echo '<h5>' . __( 'Deleting a Layout', 'option-tree' ) . ':</h5>'; |
|
637 echo '<ul class="docs-ul">'; |
|
638 echo '<li>'. __( 'End-Users mode does not allow deleting layouts.', 'option-tree' ) . '</li>'; |
|
639 echo '</ul>'; |
|
640 |
|
641 echo '<h5>' . __( 'Edit Layout Data', 'option-tree' ) . ':</h5>'; |
|
642 echo '<ul class="docs-ul">'; |
|
643 echo '<li>'. __( 'Go to the <code>Appearance->Theme Options</code> tab.', 'option-tree' ) . '</li>'; |
|
644 echo '<li>' . __( 'Modify and save your theme options and the layout will be updated automatically.', 'option-tree' ) . '</li>'; |
|
645 echo '<li>' . __( 'Saving theme options data will update the currently active layout, so before you start saving make sure you want to modify the current layout.', 'option-tree' ) . '</li>'; |
|
646 echo '</ul>'; |
|
647 |
|
648 echo '</div>'; |
|
649 |
|
650 echo '</div>'; |
|
651 |
|
652 } |
|
653 |
|
654 } |
|
655 |
|
656 /** |
|
657 * Meta Boxes option type. |
|
658 * |
|
659 * @return string |
|
660 * |
|
661 * @access public |
|
662 * @since 2.0 |
|
663 */ |
|
664 if ( ! function_exists( 'ot_type_meta_boxes' ) ) { |
|
665 |
|
666 function ot_type_meta_boxes() { |
|
667 |
|
668 /* format setting outer wrapper */ |
|
669 echo '<div class="format-setting type-textblock wide-desc">'; |
|
670 |
|
671 /* description */ |
|
672 echo '<div class="description">'; |
|
673 |
|
674 echo '<h4>'. __( 'How-to-guide', 'option-tree' ) . '</h4>'; |
|
675 |
|
676 echo '<p>' . __( 'There are a few simple steps you need to take in order to use OptionTree\'s built in Meta Box API. In the code below I\'ll show you a basic demo of how to create your very own custom meta box using any number of the option types you have at your disposal. If you would like to see some demo code, there is a directory named <code>theme-mode</code> inside the <code>assets</code> directory that contains a file named <code>demo-meta-boxes.php</code> you can reference.', 'option-tree' ) . '</p>'; |
|
677 |
|
678 echo '<p>' . __( 'It\'s important to note that Meta Boxes do not support WYSIWYG editors at this time and if you set one of your options to Textarea it will automatically revert to a Textarea Simple until a valid solution is found. WordPress released this statement regarding the wp_editor() function:', 'option-tree' ) . '</p>'; |
|
679 |
|
680 echo '<blockquote>' . __( 'Once instantiated, the WYSIWYG editor cannot be moved around in the DOM. What this means in practical terms, is that you cannot put it in meta-boxes that can be dragged and placed elsewhere on the page.', 'option-tree' ) . '</blockquote>'; |
|
681 |
|
682 echo '<h5>' . __( 'Create and include your custom meta boxes file.', 'option-tree' ) . '</h5>'; |
|
683 echo '<ul class="docs-ul">'; |
|
684 echo '<li>'. __( 'Create a file and name it anything you want, maybe <code>meta-boxes.php</code>.', 'option-tree' ) . '</li>'; |
|
685 echo '<li>'. __( 'As well, you\'ll probably want to create a directory named <code>includes</code> to put your <code>meta-boxes.php</code> into which will help keep you file structure nice and tidy.', 'option-tree' ) . '</li>'; |
|
686 echo '<li>' . __( 'Add the following code to your <code>functions.php</code>.', 'option-tree' ) . '</li>'; |
|
687 echo '</ul>'; |
|
688 |
|
689 echo '<pre><code>/** |
|
690 * Meta Boxes |
|
691 */ |
|
692 include_once( \'includes/meta-boxes.php\' ); |
|
693 </code></pre>'; |
|
694 |
|
695 echo '<ul class="docs-ul">'; |
|
696 echo '<li>' . __( 'Add a variation of the following code to your <code>meta-boxes.php</code>. You\'ll obviously need to fill it in with all your custom array values. It\'s important to note here that we use the <code>admin_init</code> filter because if you were to call the <code>ot_register_meta_box</code> function before OptionTree was loaded the sky would fall on your head.', 'option-tree' ) . '</li>'; |
|
697 echo '</ul>'; |
|
698 |
|
699 echo "<pre><code>/** |
|
700 * Initialize the meta boxes. |
|
701 */ |
|
702 add_action( 'admin_init', 'custom_meta_boxes' ); |
|
703 |
|
704 function custom_meta_boxes() { |
|
705 |
|
706 $my_meta_box = array( |
|
707 'id' => 'my_meta_box', |
|
708 'title' => 'My Meta Box', |
|
709 'desc' => '', |
|
710 'pages' => array( 'post' ), |
|
711 'context' => 'normal', |
|
712 'priority' => 'high', |
|
713 'fields' => array( |
|
714 array( |
|
715 'id' => 'background', |
|
716 'label' => 'Background', |
|
717 'desc' => '', |
|
718 'std' => '', |
|
719 'type' => 'background', |
|
720 'class' => '', |
|
721 'choices' => array() |
|
722 ) |
|
723 ) |
|
724 ); |
|
725 |
|
726 ot_register_meta_box( $my_meta_box ); |
|
727 |
|
728 }</code></pre>"; |
|
729 |
|
730 echo '</div>'; |
|
731 |
|
732 echo '</div>'; |
|
733 |
|
734 } |
|
735 |
|
736 } |
|
737 |
|
738 /** |
|
739 * Theme Mode option type. |
|
740 * |
|
741 * @return string |
|
742 * |
|
743 * @access public |
|
744 * @since 2.0 |
|
745 */ |
|
746 if ( ! function_exists( 'ot_type_theme_mode' ) ) { |
|
747 |
|
748 function ot_type_theme_mode() { |
|
749 |
|
750 /* format setting outer wrapper */ |
|
751 echo '<div class="format-setting type-textblock wide-desc">'; |
|
752 |
|
753 /* description */ |
|
754 echo '<div class="description">'; |
|
755 |
|
756 echo '<h4>'. __( 'How-to-guide', 'option-tree' ) . '</h4>'; |
|
757 |
|
758 echo '<p>' . __( 'There are a few simple steps you need to take in order to use OptionTree as a theme included module. In the code below I\'ll show you a basic demo of how to include the entire plugin as a module, which will allow you to have the most up-to-date version of OptionTree without ever needing to hack the core of the plugin. If you would like to see some demo code, there is a directory named <code>theme-mode</code> inside the <code>assets</code> directory that contains a file named <code>demo-theme-options.php</code> you can reference.', 'option-tree' ) . '</p>'; |
|
759 |
|
760 echo '<h5>' . __( 'Step 1: Include the plugin & turn on theme mode.', 'option-tree' ) . '</h5>'; |
|
761 echo '<ul class="docs-ul">'; |
|
762 echo '<li>'. __( 'Download the latest version of <a href="http://wordpress.org/extend/plugins/option-tree/" rel="nofollow" target="_blank">OptionTree</a>.', 'option-tree' ) . '</li>'; |
|
763 echo '<li>' . __( 'Unpack the ZIP archive.', 'option-tree' ) . '</li>'; |
|
764 echo '<li>' . __( 'Put the <code>option-tree</code> directory in the root of your theme. For example, the server path would be <code>/wp-content/themes/theme-name/option-tree/</code>.', 'option-tree' ) . '</li>'; |
|
765 echo '<li>' . __( 'Add the following code to the beginning of your <code>functions.php</code>.', 'option-tree' ) . '</li>'; |
|
766 echo '</ul>'; |
|
767 |
|
768 echo '<pre><code>/** |
|
769 * Optional: set \'ot_show_pages\' filter to false. |
|
770 * This will hide the settings & documentation pages. |
|
771 */ |
|
772 add_filter( \'ot_show_pages\', \'__return_false\' ); |
|
773 |
|
774 /** |
|
775 * Optional: set \'ot_show_new_layout\' filter to false. |
|
776 * This will hide the "New Layout" section on the Theme Options page. |
|
777 */ |
|
778 add_filter( \'ot_show_new_layout\', \'__return_false\' ); |
|
779 |
|
780 /** |
|
781 * Required: set \'ot_theme_mode\' filter to true. |
|
782 */ |
|
783 add_filter( \'ot_theme_mode\', \'__return_true\' ); |
|
784 |
|
785 /** |
|
786 * Required: include OptionTree. |
|
787 */ |
|
788 include_once( \'option-tree/ot-loader.php\' ); |
|
789 </code></pre>'; |
|
790 |
|
791 echo '<p class="aside">' . __( 'It\'s that simple! You now have OptionTree built into your theme and anytime there\'s an update to the plugin you just replace the old version and you\'re good to go..', 'option-tree' ) . '</p>'; |
|
792 |
|
793 echo '<h5>' . __( 'Step 2: Create Theme Options without using the UI Builder.', 'option-tree' ) . '</h5>'; |
|
794 echo '<ul class="docs-ul">'; |
|
795 echo '<li>'. __( 'Create a file and name it anything you want, maybe <code>theme-options.php</code>, or use the built in file export to create it for you. Remember, you should always check the file for errors before including it in your theme.', 'option-tree' ) . '</li>'; |
|
796 echo '<li>'. __( 'As well, you\'ll probably want to create a directory named <code>includes</code> to put your <code>theme-options.php</code> into which will help keep you file structure nice and tidy.', 'option-tree' ) . '</li>'; |
|
797 echo '<li>' . __( 'Add the following code to your <code>functions.php</code>.', 'option-tree' ) . '</li>'; |
|
798 echo '</ul>'; |
|
799 |
|
800 echo '<pre><code>/** |
|
801 * Theme Options |
|
802 */ |
|
803 include_once( \'includes/theme-options.php\' ); |
|
804 </code></pre>'; |
|
805 |
|
806 echo '<ul class="docs-ul">'; |
|
807 echo '<li>' . __( 'Add a variation of the following code to your <code>theme-options.php</code>. You\'ll obviously need to fill it in with all your custom array values for contextual help (optional), sections (required), and settings (required).', 'option-tree' ) . '</li>'; |
|
808 echo '</ul>'; |
|
809 |
|
810 echo '<p>' . __( 'The code below is a boilerplate to get your started. For a full list of the available option types click the "Option Types" tab above. Also a quick note, you don\'t need to put OptionTree in theme mode to manually create options but you will want to hide the docs and settings as each time you load the admin area the settings be be written over with the code below if they\'ve changed in any way. However, this ensures your settings do not get tampered with by the end-user.', 'option-tree' ) . '</p>'; |
|
811 |
|
812 echo "<pre><code>/** |
|
813 * Initialize the options before anything else. |
|
814 */ |
|
815 add_action( 'admin_init', 'custom_theme_options', 1 ); |
|
816 |
|
817 /** |
|
818 * Build the custom settings & update OptionTree. |
|
819 */ |
|
820 function custom_theme_options() { |
|
821 /** |
|
822 * Get a copy of the saved settings array. |
|
823 */ |
|
824 $saved_settings = get_option( 'option_tree_settings', array() ); |
|
825 |
|
826 /** |
|
827 * Custom settings array that will eventually be |
|
828 * passes to the OptionTree Settings API Class. |
|
829 */ |
|
830 $custom_settings = array( |
|
831 'contextual_help' => array( |
|
832 'content' => array( |
|
833 array( |
|
834 'id' => 'general_help', |
|
835 'title' => 'General', |
|
836 'content' => '<p>Help content goes here!</p>' |
|
837 ) |
|
838 ), |
|
839 'sidebar' => '<p>Sidebar content goes here!</p>', |
|
840 ), |
|
841 'sections' => array( |
|
842 array( |
|
843 'id' => 'general', |
|
844 'title' => 'General' |
|
845 ) |
|
846 ), |
|
847 'settings' => array( |
|
848 array( |
|
849 'id' => 'my_checkbox', |
|
850 'label' => 'Checkbox', |
|
851 'desc' => '', |
|
852 'std' => '', |
|
853 'type' => 'checkbox', |
|
854 'section' => 'general', |
|
855 'class' => '', |
|
856 'choices' => array( |
|
857 array( |
|
858 'value' => 'yes', |
|
859 'label' => 'Yes' |
|
860 ) |
|
861 ) |
|
862 ), |
|
863 array( |
|
864 'id' => 'my_layout', |
|
865 'label' => 'Layout', |
|
866 'desc' => 'Choose a layout for your theme', |
|
867 'std' => 'right-sidebar', |
|
868 'type' => 'radio-image', |
|
869 'section' => 'general', |
|
870 'class' => '', |
|
871 'choices' => array( |
|
872 array( |
|
873 'value' => 'left-sidebar', |
|
874 'label' => 'Left Sidebar', |
|
875 'src' => OT_URL . '/assets/images/layout/left-sidebar.png' |
|
876 ), |
|
877 array( |
|
878 'value' => 'right-sidebar', |
|
879 'label' => 'Right Sidebar', |
|
880 'src' => OT_URL . '/assets/images/layout/right-sidebar.png' |
|
881 ), |
|
882 array( |
|
883 'value' => 'full-width', |
|
884 'label' => 'Full Width (no sidebar)', |
|
885 'src' => OT_URL . '/assets/images/layout/full-width.png' |
|
886 ), |
|
887 array( |
|
888 'value' => 'dual-sidebar', |
|
889 'label' => __( 'Dual Sidebar', 'option-tree' ), |
|
890 'src' => OT_URL . '/assets/images/layout/dual-sidebar.png' |
|
891 ), |
|
892 array( |
|
893 'value' => 'left-dual-sidebar', |
|
894 'label' => __( 'Left Dual Sidebar', 'option-tree' ), |
|
895 'src' => OT_URL . '/assets/images/layout/left-dual-sidebar.png' |
|
896 ), |
|
897 array( |
|
898 'value' => 'right-dual-sidebar', |
|
899 'label' => __( 'Right Dual Sidebar', 'option-tree' ), |
|
900 'src' => OT_URL . '/assets/images/layout/right-dual-sidebar.png' |
|
901 ) |
|
902 ) |
|
903 ), |
|
904 array( |
|
905 'id' => 'my_slider', |
|
906 'label' => 'Images', |
|
907 'desc' => '', |
|
908 'std' => '', |
|
909 'type' => 'list-item', |
|
910 'section' => 'general', |
|
911 'class' => '', |
|
912 'choices' => array(), |
|
913 'settings' => array( |
|
914 array( |
|
915 'id' => 'slider_image', |
|
916 'label' => 'Image', |
|
917 'desc' => '', |
|
918 'std' => '', |
|
919 'type' => 'upload', |
|
920 'class' => '', |
|
921 'choices' => array() |
|
922 ), |
|
923 array( |
|
924 'id' => 'slider_link', |
|
925 'label' => 'Link to Post', |
|
926 'desc' => 'Enter the posts url.', |
|
927 'std' => '', |
|
928 'type' => 'text', |
|
929 'class' => '', |
|
930 'choices' => array() |
|
931 ), |
|
932 array( |
|
933 'id' => 'slider_description', |
|
934 'label' => 'Description', |
|
935 'desc' => 'This text is used to add fancy captions in the slider.', |
|
936 'std' => '', |
|
937 'type' => 'textarea', |
|
938 'class' => '', |
|
939 'choices' => array() |
|
940 ) |
|
941 ) |
|
942 ) |
|
943 ) |
|
944 ); |
|
945 |
|
946 /* settings are not the same update the DB */ |
|
947 if ( $saved_settings !== $custom_settings ) { |
|
948 update_option( 'option_tree_settings', $custom_settings ); |
|
949 } |
|
950 |
|
951 } |
|
952 </code></pre>"; |
|
953 |
|
954 echo '</div>'; |
|
955 |
|
956 echo '</div>'; |
|
957 |
|
958 } |
|
959 |
|
960 } |
|
961 |
|
962 /* End of file ot-functions-docs-page.php */ |
|
963 /* Location: ./includes/ot-functions-docs-page.php */ |