Welcome to Dagon Design. In addition to free scripts, WordPress plugins, and articles, we offer a variety of services including custom theme design, plugin creation, and PHP scripting. Contact me for more information.

Version 1.2   Updated Thursday, February 19th, 2009 at 7:19pm

Expanding Text plugin for WordPress

This WordPress plugin allows you to create sections of text in your post or page which expand/collapse when clicked on. You simply wrap the special tags around your text, and set the ‘expand link’ (the link visitors click on to show the text). If your visitors do not have javascript enabled, the ‘expand link’ is not shown, and the text is displayed normally.

Download

  If you have found this page useful, please consider donating. Thanks!

Change Log

  • 02-19-09 Version 1.2 – Changed wrapper tags *must change existing links when updating!* Fixed validation errors, and issues switching between code and html view
  • 10-09-08 Version 1.1 – Now works properly when the exact same expanding text is used more than once on the page
  • 08-14-08 Version 1.0 – First release

Installing

  • Download the above file, rename it from .txt to .php, and upload it to your plugins directory.
  • Enable the plugin.
  • Optional: Add the CSS to your theme’s style sheet to make it look nice (see the customization section below).

Usage

To make your text expand/collapse, use the following format in your post or page:

Important: Make sure you add this using the html/code editor in WordPress, not the visual editor. In new versions of WordPress, just click the ‘html’ button above the edit box. If you use the visual editor it will not work, as the actual code you entered will be seen on the page, instead of being processed by the script.

Notice: If upgrading from version 1.1, make sure you change your existing code to match the examples below. The tags have been changed to cause less issues.

[DDET (expand link text)]
(Text to expand)
[/DDET]

Example:

[DDET Click to expand!]
Here is your text!
[/DDET]

You can add as many sections of expanding text as you like.

Demo

Here you can see the plugin in action:

Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text! Here is your text!

Customization

To style the expanding text boxes, you must add the .ddet_div class to your theme’s css file. Here is an example:

.ddet_div {
  margin: 8px 0 0 12px;
  padding: 8px;
  background: #F4F4F4;
  border: 1px solid #DDDDDD;
}

Pages: « 9 8 [7] 6 5 4 3 2 1 » Show All

  1. 105
    Brice
    3-22-10 9:19PM

    Hi there! cool plugin which can be very useful in some cases. just a question though. it has been asked before but has not been answered as yet i believe. is it possible to choose the heading size and font (for example H1, H2, H3…) for the title that commands the expanding text? it seems the plugin does not work when you change it. I’d like the headings to look bigger than the expandable text on http://www.worldsbestbeaches.net/australia/bondi-beach-australia.html
    thanks for the great plugin and for the support!
    brice

  2. 104
    Leanne
    3-22-10 12:45PM

    Great plugin and does the job but for me it leaves a lot of space between the first and second link.
    Example:

    Linked Text 1

    Linked Text 2
    Linked Text 3
    Linked Text 4
    Linked Text 5

    I can see someone already asked this question but it was not answered.

    Can anyone help?
    Leanne

  3. 103
    mali
    3-18-10 9:45AM

    Can I add this Plugin into the template? Because I want to use it inside the template code.. not actually in the post or page? is it possible?

  4. 102
    Johan Brodd
    3-10-10 3:50AM

    I would really love to use this plugin, but as it is now I don’t know how to install it. It doesn’t even show up in Wordpress’s plugin installer. So please update the plugin with a zip that can b e used to install in Wordpress.

  5. 101
    Matt
    1-21-10 11:45AM

    Hmm. This script isn’t very search friendly.
    The built in WP search returns a lot of the javascript too.

    expand(document.getElementById(‘ddet1162979334?));expand(document.getElementById(‘ddetlink1162979334?))

    Appears between the button text and the expand text on each search result. Ugly.
    Can we get a fix? :)

  6. 100
    Max
    12-22-09 5:59PM

    So, I tried installing this (and I believe I installed it correctly), but it doesnt work. Whenever I implement the DDET tags, all that happens is the text in the tags goes blank

  7. 99
    dgodfather
    12-17-09 3:07PM

    Any resolution on this?

    When I have multiple expanding text blocks, one after the other, the first one adds a large margin before the second.

    Example:

    Linked Text 1

    Linked Text 2
    Linked Text 3
    Linked Text 4
    Linked Text 5

    Live – http://trusupremekillaz.com/tsktesting/?p=634

  8. 98
    Eliot
    11-25-09 1:01PM

    Hi, anyone know if the text inside the hidden content is visible to Googlebot when the page is indexed? Thanks

  9. 97
    cory
    11-21-09 12:42AM

    nice script. my only complaint is that it has some weird spacing issues (putting space or break where there appears to be none in the html). also when i save it, sometimes the code is messed up.

  10. 96
    R@1n
    11-11-09 2:19AM

    thank’s for the info

  11. 95
    Cigar Inspector
    10-25-09 9:38AM

    Great plugin! Thank you.

  12. 94
    melux
    10-22-09 10:52AM

    Hi,

    first of all, really nice work !
    I just have a small question : does someone know how I could make something like

    
[DDET an image that will be just for one post ] my text [/DDET]

    Just to explain : I want to only have an image in my post, that will be the link of the DDET code. I can’t put my image in the php code cause I want one different image by post. Am I clear ?

    Thanks !

  13. 93
    xavier
    10-10-09 1:37PM

    This is a great plugin, however i can’t have it work with a form plugin called ‘mm forms’.

    When mm forms is deactivated ddet works fine, when mm forms is activated ddet shows as if javascript was disabled.

    Any idea why so, and above all how to fix that?

    Thanks

  14. 92
    R
    10-6-09 10:07PM

    Great plugin!
    I´m using it to make an expandable list. Is there a way to automatically collapse an open text when a new element is expanded, as to ensure there is never moore than one element expanded?

  15. 91
    Thomas
    10-6-09 3:04PM

    Hmm. If I try to use this in conjunction with a document’s H1/etc formatting, it tends to not work:

    
<h3>[DDET Chiropractic Addresses All Three Types of People]</h3>
First, chiropractic is the art, science and philosophy of adjusting the vertebrae of the spinal column in order to restore and maintain normal nerve flow, which in turn, assists the body with normal health and healing.[/DDET]

    Any suggestions for this? Thank you in advance for your help.

Pages: « 9 8 [7] 6 5 4 3 2 1 » Show All

Leave a Comment

Before you comment: If you are having an issue with a script, please make sure you have read the entire article. Also, please read through the comments because most common issues have already been discussed many times. Thanks.


Be sure to wrap all code in <code></code> tags.