Write tab customize

Note: This version is for Textpattern v4.7 and is not compatible with earlier versions of Textpattern.

This plugin provides the ability to customize Textpattern’s “write” panel. It makes it possible to rearrange UI items, hide parts of the UI on a per-section basis, hide specific sections from the Sections dropdown and more.

By combining its features you can re-arrange the write tab differently depending on the section you choose in the sections dropdown. Used on its own or together with other plugins (e.g. glz_custom_fields and bot_admin_body_class), it will help you customize the Textpattern admin area to meet your clients needs.

Features

Single UI items (custom fields, body, excerpt etc.) or whole regions (main content, sidebar etc.) can be moved around relative to other single items or regions
UI Items can be hidden on a per-section basis
Sections can be hidden from the “write” panel sections dropdown (for static sections like “about us” or “search”)
A custom css class can be set for each item. This let’s you add classes to items to target with your own javascript.
Javascript code can be set directly through the plugin interface. Particularly useful for use with an external jquery plugin and in conjunction with the ability to add a css class to any item on the page. The script will be executed only in the Write panel.
Advanced settings for hiding / attributing classes to multiple items – helpful on sites with lots of custom fields.
Compatible with glz_custom_fields.

bot_wtc’s rearranging capability offers a simple way of customizing Textpattern, but is just one tool for customizing the admin area. More extensive modifications, e.g adapting Textpattern your customer’s branding, can be achieved by creating an own admin theme.

Installation

Paste the .txt or .zip.txt package code into the Admin > Plugins panel, install and enable the plugin. Visit the “Extensions” tab and customize your write tab settings.

Upgrade notes

The plugin should take care of updating existing data to match the v4.7. panel layout on activation. Nevertheless, it is strongly recommended to back up your database prior to updating so that you can restore your settings should something go awry.

Examples

Example: Adding a menu title beneath the regular Title field

Define a custom field called ‘menu_title’ in ‘Admin › Preferences » Custom fields’ or using the glz_custom_fields plugin. If using glz_custom_fields, you can give it a title text of ‘Menu title’. It will appear in the ‘custom fields’ group on the write panel.
Switch to the ‘Write Tab Customize’ panel, create a rule ‘Menu title’ > After > ‘Title’. It will now appear beneath the title.

Example: Showing fields on certain sections only

Suppose you have an ‘events’ section and an ‘organisers’ section, and custom fields called ‘event_location’, ‘event_time’, ‘event_duration’ and ‘organiser_address’, ‘organiser_tel’, ‘organiser_email’.

Switch to the ‘Write Tab Customize’ panel, create a rule ‘event_location’, then click on ‘Section list’ and place a checkbox next to all the section except ‘events’. Click the ‘Update’ button, and repeat for each event custom fields. The fields will now only show when “events” is chosen in the Section dropdown.
Now create a rule ‘organiser_address’, then click on ‘Section list’ and place a checkmark next to all the section except ‘organisers’. Click the ‘Update’ button, and repeat for each organiser custom fields. The fields will now only show when “organiser” is chosen in the Section dropdown.

Alternative: If you have a lot of custom fields, it can be tiresome to set these settings for each custom field individually. A quicker way to set several custom_fields at once is to choose “Toggle advanced” at the top right. Now put a checkmark next to all the “event_” custom fields and checkmarks next to all the sections except the ‘events’ section. Click the ‘Update’ button and they will all be set at once.

Example: Using classes to address fields with javascript / jQuery

Suppose you want to draw attention to some specific fields to ensure they are not overlooked by making them pulsate briefly when the ‘Write’ panel loads.

In the ‘Write Tab Customize’ panel, assign a class required (without a dot) to all the items that need to be filled out.
Add the appropriate javascript code in the ‘Add javascript’ box as follows (use the buttons to insert boilerplate code):

<script src= "/js/jquery.pulsate.js"></script>
<script>
$(document).ready(function() {
  $(".required").pulsate({times:3});
});
</script>

For this simple example you’ll need to have the file jquery.pulsate.js in the js directory.
You can extend this principle, for example to highlight required fields that have no content and still need to be filled out, or to validate that field data has been entered correctly.

Tip: Making collapsible groups permanently open

Suppose you wish to prevent your users from overlooking fields in collapsible groups. You can use ‘Write Tab Customize’ to hide the label headings for each collapsible group, so that the “twisty” arrow that make it possible to show/hide the group will no longer be accessible. You can also hide the “expand all/collapse all” buttons. Now all you need is the following tiny jQuery rule in the ‘Add javascript’ box to ensure every collapsible group is automatically opened when the page opens:

<script>
$(document).ready(function() {
  $(".toggle").show();
});
</script>

Notes and known issues

Order does matter: The rules for moving items are executed from top to bottom so if the sequence gets garbled it’s advisable to delete them all and start over.
Class names must be inserted without the dot.
If you want to hide an item in all sections, it is more efficient to hide items using css than it is to hide them using this plugin. See below.
This plugin may not function properly if you have the Suhosing module (a security-related module for PHP) installed. In this case follow these instructions (thanks maniqui!).

Other ways of customising the admin UI

Successive versions of Textpattern have brought extensive enhancements to the “write” panel and almost every item now has an id or a class which means snappier jquery execution but more importantly also makes it possible to hide these elements with simple css in a theme. Hiding items using CSS is more efficient than using javascript / jQuery but cannot respond conditionally to section changes.

If you have elements you will consistently hide or restyle or javascript you consistently use – i.e. that is not dependent on the chosen section – you can add an optional user-defined custom CSS and JavaScript file to your textpattern installation directory. By default, these are located at:

assets/css/custom.css
assets/js/custom.js

You may use different file names by adding the following line(s) within your Textpattern ‘config.php’ file (before the closing ?> line):

define('admin_custom_css', 'your_custom_rules.css');
define('admin_custom_js', 'your_custom_javascript.js');

For examples, see the Readme and custom-example.css in the admin-themes.

Changelog

8.1 – 2024-07-15 (jools-r)

Textpattern v4.9 support
Fix for mysqli query error when adding new settings via the advanced settings pane (missing column defaults)
Plugin install and update routine to add column defaults if not already present.
Update deprecated jquery – hopefully fixes flaky field updates on save
Support for CSP-aware (nonced) inline and <script> blocks. Textpattern v4.9+ (when activated in config.php)</li> </ul> <h3>8.0 – 2018-03-26 (jools-r)</h3> <ul> <li><strong>Note: for Textpattern version 4.7 only.</strong> No longer compatible with earlier versions of Textpattern.</li> <li>Write tab area classes and id updates to match Textpattern v4.7’s ‘Write’ panel layout.</li> <li>Revised custom field handling to reflect new UI pattern, including migration of previous settings on installation.</li> <li>Revised ‘Write Tab Customize’ panel using txp’s in-built UI functions.</li> <li>Compatibility with glz_custom_fields v2 (e.g. custom field titles).</li> <li>Translatable UI text (see Textpack).</li> <li>Error notices now use Txp’s own in-built messaging functions.</li> <li>Revised help.</li> </ul> <h3>7.5 – 2016-05-22</h3> <ul> <li>Further write tab area classes and id updates for Textpattern v4.6. (jools-r)</li> <li>Updated install routine to use Textpattern’s built-in functions (jools-r) for better <span class="caps">PHP</span> 7 compatibility.</li> </ul> <h3>7.4 – 2015-12-07</h3> <ul> <li><strong>Note: for Textpattern version 4.6 only.</strong> No longer compatible with earlier versions of Textpattern.</li> <li>Updated write tab area classes and id for Textpattern v4.6 (jools-r).</li> </ul> <h3>7.3 – 2014-06-14</h3> <ul> <li>Updated to address “Sorry, the form could not be submitted” error in 4.6 (by mrdale).</li> <li>Update bot_wtc extension panel to use new “hive” admin controls.</li> </ul> <h3>7.1</h3> <ul> <li>Fixed <a href="http://forum.textpattern.io/viewtopic.php?pid=245511#p245511">issue with multi-select and checkboxes</a> custom fields.</li> <li>Fixed deprecated jquery.</li> <li>Changed ‘sections’ field <a href="http://forum.textpattern.io/viewtopic.php?pid=254132#p254132">from varchar to text</a>.</li> <li>Removed deprecated language attribute from ‘script’ tag.</li> <li>Updated help.</li> <li>Cleaned up code.</li> </ul>