Special Text Boxes is very simple, very little and very useful WordPress plugin (for me and, I hope, for you). It adds little style sheet file and short code to blog for highlighting some portion of text in post as colored boxes. That may be warning, alert, info and download portion of post’s text.
(This post is available on russian language.)
Support Forum for this plugin.
Examples
CSS mode
Javascript mode
Installation
- Unpack plugin archive file.
- Put plugin folder to WordPress
wp-content/plugins
folder. - Activate plugin on Admin page.
Settings
You can set border style, text shadow, box shadow and Allow or disable rounded corners for your special text boxes.
Available languages of Admin Panel:
- English
- Russian
- Italian by Gianni Diurno
- Belarus by Fat Cower
- Uzbek by Alisher Safarov
- Polish by Daniel Fruzynski
- Arabic by مدونة رسين
- Dutch by Rene
- Ukrainian by official ukrainian localization team
- German by Renate
- Czech by Stanislav Čihák
If you want and can translate this plugin to your language, do it, and send me .po file by e-mail (minimus AT simplelib.com). Thanks.
Styles Repository
Starting with version 4.0.65 plugin allows you to have as many styles as you want. All styles are stored in the styles repository (database table) and can be customized to suit every taste. Styles fall into two categories: predefined (system and special) styles, and custom styles. The parameters of all styles can be changed by blog administrator. The difference is that the slugs (unique names) can be set only for custom styles. Slugs for predefined styles can not be changed.
Use this repository to customize existing and create new styles of blocks.
Usage
To embed special textbox to your post, use short code as this:
where defined_id may be alert, download, info, warning, black, custom and gray.
You can insert short code(s) of another plugin(s) inside wp-special-textboxes short code. For example:
There is example of using Download Manager plugin short code with wp-special-textboxes plugin short code. The result of using this code construction you can see below in the Download section of this post.
Customising “On The Fly”
Customisation Short Code Options:
- color – body font color
- ccolor – caption font color
- bcolor – border color
- bgcolor – background color (CSS mode) or start color of background gradient (Javascript mode)
- bgcolorto – stop color of background gradient (Javascript mode only)
- cbgcolor – caption background color (CSS mode) or start color of caption background gradient (Javascript mode)
- cbgcolorto – stop color of caption background gradient (Javascript mode only)
- image – full URL of pictogram image. Use null value as URL to disable image output
- big – use this parameter in case plugin settings are different with your needs. May be true or false. CSS mode only.
- mode – drawing mode (css|js)
- float – turn on floating mode of Special Text Box. May be true or false.
- align – alignment of box in float mode. May be left or right.
- width – width of box in float mode (pixels)
- collapsed – display STB in collapsed mode if collapse/expand mode enabled. May be true or false.
- mleft – left margin in px.
- mright – right margin in px.
- mtop – top margin in px.
- mbottom – bottom margin in px.
- collapsing – allow/disable collapsing (default|true|false)
- defcaption – allow using name of style as caption of block (true|false)
- direction – language direction (default|ltr|rtl)
You can use Insertion Dialog to insert short code to post. Just select text you needed and click “Insert Special Text Box” button.
Special Text Box anywhere in blog
You can use function stbHighlightText to output Box anywhere in your blog.
This function defined as
1 |
function stbHighlightText( $content = null, $id = 'warning', $caption = '', $atts = null ) |
- $content – text in the Box (string)
- $id – ID of Box (string)
- $caption – caption of Box if needed (string)
- $atts – extended attributes of Box (array)
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 |
atts = array( 'id' => 'warning', 'mode' => '', 'level' => 0, 'caption' => '', 'defcaption' => '', 'color' => '', 'ccolor' => '', 'bcolor' => '', 'bgcolor' => '', 'bgcolorto' => '', 'cbgcolor' => '', 'cbgcolorto' => '', 'bwidth' => '', 'image' => '', 'big' => '', 'float' => 'false', 'align' => 'left', 'width' => '200', 'collapsed' => '', 'mtop' => '', 'mleft' => '', 'mbottom' => '', 'mright' => '', 'direction' => '', 'collapsing' => 'default', 'shadow' => '' ); |
- color – body font color (six HEX digits of color without # as string)
- ccolor – caption font color (six HEX digits of color without # as string)
- bcolor – border color (six HEX digits of color without # as string)
- bgcolor – background color (CSS mode) or start color of background gradient (Javascript mode) (six HEX digits of color without # as string)
- bgcolorto – stop color of background gradient (Javascript mode only) (six HEX digits of color without # as string)
- cbgcolor – caption background color (CSS mode) or start color of caption background gradient (Javascript mode) (six HEX digits of color without # as string)
- cbgcolorto – stop color of caption background gradient (Javascript mode only) (six HEX digits of color without # as string)
- image – full URL of pictogram image. Use null value as URL to disable image output (string)
- big – use this parameter in case plugin settings are different with your needs. May be true or false (boolean as string). CSS mode only.
- mode – drawing mode (css|js)
- float – turn on floating mode of Special Text Box. May be true or false. (string)
- align – alignment of box in float mode. May be left or right. (string)
- width – width of box in float mode (pixels) (string)
- collapsed – display STB in collapsed mode if collapse/expand mode enabled. May be true or false. (string)
- mleft – left margin in px.
- mright – right margin in px.
- mtop – top margin in px.
- mbottom – bottom margin in px.
- collapsing – allow/disable collapsing (default|true|false)
- defcaption – allow using name of style as caption of block (true|false)
- direction – language direction (default|ltr|rtl)
- level – nesting level of the block. Only Javascript mode. Allows you to defer the drawing of the indoor block as long as parent block will be drawn. (0|1)
- shadow – enables/disables shadow of block vs default settings
You can partially define atts array (version 2.0.22+). For example:
1 2 3 |
<?php stbHighlightText('This is content', 'warning', 'This is caption', array('image' => "//www.simplelib.com/images/wp-b.png", "big" => "true")); ?> |
or
1 2 3 4 5 6 |
<?php if(class_exists('StbBlock')) { $block = new StbBlock('This is content', 'warning', 'This is caption', array('image' => "//www.simplelib.com/images/wp-b.png", "big" => "true")); echo $block->block; } ?> |
In this example the image of block was redefined as “wp-b.png” image and this one was defined as big image.
Inserting Special Text Box into Special Text Box
If you want insert one STB to another, you can use additional short code “stb“. For example:
CSS mode
Javascript mode
Special Text widget
Download
Tests
Video Lessons
Awards
© 2009 – 2024, minimus. All rights reserved.
Since several days, your nice plugin doesn’t work on my website : it just display text on a colapsable white box like here : //lagazette-blog.fr/art-lettres/livres/et-dans-mes-veines-coulait-le-sang-de-mon-pere-claire-tournu-woimbee/.
Do you have some informations/solutions ?
Thanks.
Total Comments by Arle Uein: 5
Can’t open your page … Check last installed plugins for compatibility with STB …
Total Comments by minimus: 167
It’s strange you can’t open the page. I found the plugin which is responsible of this bug : Simple:Press Forum
Total Comments by Arle Uein: 5
[…] Here is the original post: WordPress plugin Special Text Boxes | SimpleLib […]
Hi. I’m having problems with images not rendering, and instead there is parts of the image code is showing on my site.
Here is an example of my shortcode:
Here is what is showing:
sitesubscribe.com/wp-content/plugins/wp-special-textboxes/images/info.png); min-height: 20px; padding-left: 25px; “>
Discount automatically applied at checkout.
Here’s the URL where you can see it:
//sitesubscribe.com/membership-signup/discounts/
Any ideas?
I’m going to have to disable this plugin if I can’t get this to work soon.
Thanks.
Total Comments by MileHighTechGuy: 8
It may be too soon to tell, but it seems like deactivating and reactivating the plugin fixed the problem.
I lost my customization settings and had to re-enter them after reactivating, but so far it looks like that may have solved the issue.
Total Comments by MileHighTechGuy: 8
I still see the problem on your site …
Maybe some of the installed plugins creates this problem. Try to test the compatibility of plugins. On my test blog your code does not create any problems …
Total Comments by minimus: 167
This plugin was working great until a few days ago. I can now only see text, with no box. I have tried deactivating, then reactivating and that isn’t doing the trick. For example, the text in italics is supposed to be inside of a box: //momspark.net/blogging-101-media-kits-one-sheets/
I can’t figure out what it is, but I noticed someone above mention Simple Press Forum, which I do have on my blog, is that the culprit?
Total Comments by Amy: 2
Please check what plugins you have installed a few days ago and their compatibility with the STB!
Total Comments by minimus: 167
It was the Simple Press Forum plugin. The two do not work together. Too bad because I really liked the special text boxes.
Total Comments by Amy: 2
The W3C Markup Validation test more errors
Total Comment by Ahmet: 1
CSS3 styles…
Total Comments by minimus: 167
Hi. I’m trying to use the page template code. Does it allow the ‘collapse’ parameter? I tried adding it and no matter what I do the STB within the page template display as expanded…I want them collapsed by default (on page load).
thanks
Total Comments by MileHighTechGuy: 8
Fixed! 🙂
Sorry!
Total Comments by minimus: 167
When I upgraded to the latest version it seemed to create lots of problems. The box doesn’t show and the Dashboard and a number of widget control pages – for instance NextGen Gallery – disappear. These problems stopped when I deactivated Special Text Boxes. I like your plug-in but can’t seem to use it these days.
I did upgrade to 2.9.2 on WP, and upgraded a number of other plug-ins as well. My ISP informed me they a re running PHP version 5.1.6.
Jon
Total Comments by Jon Kaplan: 4
Read the other comments which I should have done first. I too just upgraded Simple Press forum.
Total Comments by Jon Kaplan: 4
I don’t know why, but the STB-plugin is not compatible with the plug Simple Press … 🙁
I use phpBB as forum on subdomain.
Total Comments by minimus: 167
As of this morning I can’t seem to get the new version of STB to work on my site even after deactivating Simple Press. In fact, the whole site is seeming unstable after updating STB, WP and some other plugins. Right now I have STB deactivated. If it would help I’d be glad to reactivate it.
I’m a real fan of STB, it has a good look and worked well previously to whatever is going on now. Hope we can work this out. Thanks for your help.
Total Comments by Jon Kaplan: 4
I uninstalled Simple Press and the STB box plugin is still not working right (see site, upper left column) but the Dashboard is working correctly. Any suggestions most appreciated.
Total Comments by Jon Kaplan: 4
I tried to open the file wp-special-textboxes.css.php on your server …
Server Response: Not Found
Check all STB files on your server!
Total Comments by minimus: 167
“Simple:Press” removes styles of all tags, include “div”, located in the tag “content”. Naturally, it removes the styles of “div” tag of STB plugin. As result, STB not show text’s styles.
Total Comments by minimus: 167
How do i justify the text so i can centre it?
thanks
Total Comment by Tony: 1
Use the tag center (HTML mode), or set the text alignment to center (Visual Editing mode).
Total Comments by minimus: 167
Hi there,
I have used STB for a while now but I have noticed on all of my sites that the insert box is greyed out?
on WP 2.9.2 and 3.0 using the latest version of STB
Any ideas?
thanks
Andy
Total Comments by Andy Bird: 5
Send me screenshots to minimus AT simplelib.com
Total Comments by minimus: 167
I am an idiot… you have to select then activate!!!!!
sorry sorry sorry
Total Comments by Andy Bird: 5
Don’t worry, you are not the first… 😉
Total Comments by minimus: 167
Thanks a lot minimus !!!
Your Special Text Boxes are very useful for me.
Keep up the great work !
Total Comment by Online Computer Support: 1
Thanks for great plugin, and I want to tell you that it’s not working with wordpress 3.0 !
Although I could use it shortcut but admin page not exists in addition to editor button is inactive!
What’s wrong! ?
PS
I didn’t face this problem before wordpress 3.0
Total Comments by M. Bashir Al-Noimi: 2
Just a reminder!
Total Comments by M. Bashir Al-Noimi: 2
Just select any text to highlight it!
Total Comments by minimus: 167
DOH!!!
just realised that this is my problem!! doh doh doh
Total Comments by Andy Bird: 5
Cool cool WP plugin> text boxes galore //www.simplelib.com/?p=11
[…] cool WP plugin> text boxes galore //www.simplelib.com/?p=11 […]
hi i have been using this plugin for quite some time now. and suddenly yesterday the collapsing element stopped working in safari, i check in firefox and it still works. i have tried un install reinstall deactivated and reactivated all plugins on my wordpress, please tell me how i can fix this . my web check here //iGyaan.in/2010/07/09/the-new-renault-dezir-charges-in-a-flash/
Total Comments by BHARAT: 2
never mind it was just a misplaced
code oh well
Total Comments by BHARAT: 2
Try to insert the text after the STB and see what happens … Maybe this will help…
Total Comments by minimus: 167
Great plugin, I just have a question here. Since, the admin page isn’t working in WP 3.0, how do I manually enable collapse/expanded STB?
Total Comment by Kilbaine: 1
shortcode option collapsed=”true” or collapsed=”false”
Total Comments by minimus: 167
Hi. Thank you for great plugin! Here is ukrainian translation for it (from our official ukrainian localization team)
//wordpress.co.ua/download/plugins/wp-special-textboxes-uk.rar
Total Comments by AzzePis: 2
Большое спасибо! Постараюсь опубликовать в самое ближайшее время! 😉
Total Comments by minimus: 167
Нет за что…
Пы.Сы. Отправил прошлый коммент, а потом нашёл инфу, что автор русскоговорящий 🙂 Решил не спамить и повторно не писать 🙂
Total Comments by AzzePis: 2
This is excellent except I can’t get it to work in the sidebar widget. It works fine if on pages and in posts. I just get a box with no caption. What am I doing wrong?
Total Comments by Mark Harrison: 3
Some problems with STB code… No caption… Sorry! Wait bugfix!
Total Comments by minimus: 167
Thanks alot!
Total Comments by Mark Harrison: 3
Sorry – my site is //effortlessabundance.com/
Total Comments by Mark Harrison: 3
Hello, This plugin works great on FireFox, Safari and IE6, however when I view it in IE7 the page doesn’t grow with the content of the Spoiler – it overlaps the content under the spoiler. Is there a fix for this bug? Thanks and here is a link to my test page; //briantest.com.php5-18.websitetestlink.com/chloetest/specialtestplugin/
Total Comments by Brian R.: 3
Please, insert any text after STB block. I want to see what will happen.
Total Comments by minimus: 167
Hello,
Thanks for responding so quickly. I have placed some text after the STB block as you requested. The text gets pushed down but the Blog section is still overlapping. I to widen the STB Block to 550px so the text didn’t appear to the right of the STB block.
I have also noticed the style of the STB Block doesn’t display correctly in ie7. Here is the link again: //briantest.com.php5-18.websitetestlink.com/chloetest/specialtestplugin/
Total Comments by Brian R.: 3
I think this is a problem of compatibility jQuery with IE7 🙁
Total Comments by minimus: 167
Hello, the div that resides under the STB had a setting of position: relative. I changed the div style rule to: position: static, all works fine now.
I hope this helps you and others in the future.
Total Comments by Brian R.: 3
Thanks a lot!
Total Comments by minimus: 167
I have tried to use a Special Text Box within another Special Text Box. But it dos not work! Is there a working way to do so?
Total Comments by Erkan: 2
Open file wp-special-textboxes.php. Find next codes (lines 73..74):
[codesyntax lang=”php” title=”Old code”]
[/codesyntax]
and change it as this:
[codesyntax lang=”php” title=”New code”]
[/codesyntax]
Now you are add new short code. Use it as inside STB:
[codesyntax lang=”php” title=”Short code”]
This codes will be added to next patch of STB.
Total Comments by minimus: 167
Nesting Special Text Boxes within one another is a feature I have really wanted for a long time. This plugin rocks!
I’ll wait for the patch. Looking forward to the update.
Many thanks!
Total Comments by MileHighTechGuy: 8
Thank you!
Total Comments by minimus: 167
The code for nesting STB inside another STB is now in the latest release, right?
I can’t get nesting to work. Can you please provide a fully coded example showing the parent shortcode with the related expanded text, and the nested shortcode along with the related expanded text? Maybe I’m doing something wrong…
Total Comments by MileHighTechGuy: 8
Maybe I’m doing it right but don’t fully understand how it is supposed to work. I get the nested alert box, but not with any drop down for showing related content, the related content is always showing. Is there a way to have a nested alert or other type of STB with collapsed related content? Is there a way to assign and ID type for the nested STB?
Total Comments by MileHighTechGuy: 8
Use stb short code inside stextbox short code!
Do it manually! With assistance of Insertion Dialog, you can insert only stextbox short code! Use Insertion Dialog for inserting one stextbox short code into another and change manually code name of indoor stextbox to stb code name!
Total Comments by minimus: 167
Sweet! Got it working perfectly now… THANKS!
(BTW, I always just code it all manually.)
Total Comments by MileHighTechGuy: 8
🙂
Total Comments by minimus: 167
The plugin is great but it is not compatible with IE6 and IE7. I wish it was. Is there a way to make it compatible?
//www.erdogdu.net/erdogdu.net/english_system_files/?page_id=5
Total Comments by Erkan: 2
I have been using this plug-in for quite a while because it provides a change up in the looks of the posts. I can’t understand why this has not occurred to any of the WordPress developers. None of the other text box programs are as easy to use or as effective as this one.
You can see in action at //UofLCardGame.com
Total Comments by Charlie: 11
Thanks, Charlie! 🙂
Total Comments by minimus: 167
The drop down arrow to the right of the box does not reside center right.. It starts out down and left a few pixels. It then shifts left @ 30 pixels for every instance of STB that I put on the page. When it hits the text in the left hand side, it then shifts all the way right and down again, only to shift left another 30 or so pixels for every instance of STB I put on the page.
Also, I am trying to figure out how I can install STB with my own color set Like the custom one, for each site I would like to use it on. Where do I find the html for setting these. Can the settings survive a plugin update? (I’m still learning CSS – not a programmer, but can find files and alter once I know what to do.)
It would be nice if you had a setup box for each type of box, with a color picker to be able to go to any browser and pick a color. As it is, I have to PrintScreen, then load photoshop, paste the clipboard and then pick and color. I could see having an original set, (as you do now) then having a way to add an instance or box item for each new custom box. I could add as many as I need of the colors I need for my sites.
Thanks,
Davekat
Total Comments by Davekat: 20
Bug are fixed! Wait patch 3.7.51
Total Comments by minimus: 167
Looks Good in FireFox.
IE8 still a problem. Color defaults to background color with a 1 pixel stripe across, arrow still down and shifted.
Total Comments by Davekat: 20
I now have a font color problem
as well as IE8 problem.
Please refer to jpg’s:
//ctwsys.com/n147I/FireFox_box_Collapsed.jpg
//ctwsys.com/n147I/FireFox_box_show.jpg
//ctwsys.com/n147I/IE8_box_Collapsed.jpg
//ctwsys.com/n147I/IE8_box_show.jpg
for examples.
Here are the values I am using in the “Custom Box Editor” including the font size.
In FireFox, it looks pretty good, but in IE8 not good at all.
I should install Google Chrome and look at it…
FFFFFF
FFFFFF
0
0
8D610B
8D610B
3F3631
Thanks
Dave
Total Comments by Davekat: 20
Also now running patch 3.7.51 for the above examples.
Total Comments by Davekat: 20
basically, from what I can tell,
“
Define font color for Custom Special Text Box
This is a font color of Custom Special Text Box (Six Hex Digits).
”
stopped working. It is not taking my Hex color.
Also, back to altering the other boxes. What CSS or php file can I do this at?
Total Comments by Davekat: 20
More…
As you can see, I am having troubles with another plugin also called “Special Text Boxes”. I have sent this same info to them also. I am looking for a solution. thanks.
Here is a link to a site to see in real time.
//lightyourtreasures.com/?page_id=6
Here are jpg’s of what I see in FireFox
//lightyourtreasures.com/47in132/FireFox%20LYT.jpg
and now in Internet Explorer 8
//lightyourtreasures.com/47in132/IE8_LYT.jpg
I have not checked Google Chrome or any of the others.
Thanks,
Dave
Total Comments by Davekat: 20
I meant to say “WP-Tables-Reloaded” for the other plugin.
Total Comments by Davekat: 20
You can change file css/wp-special-textboxes.css.php
Total Comments by minimus: 167
With a little more experimenting I found that if I set the box to be uncollapsed, the table filled the width. If I set the table to be collapsed I got the narrow table. It would seem that the code is slightly different in your “if uncollapsed or collapsed” function. Maybe a space or something that doesn’t belong in the code. Hope this helps.
My example Link…
//lightyourtreasures.com/table/?#Black_STB_Box
or //lightyourtreasures.com/table/
and scroll the bottom – look for the black STB’s
Great Plugin BTW,
Thanks
Dave
Total Comments by Davekat: 20
It seems to me, WP-Tables-Reloaded plugin can not determine the width of a hidden DIV, and in this case, draw a table with a minimum width.
Total Comments by minimus: 167
Hidden DIV?
Not a programmer here. Is it something I can fix or have a conflict with?
I disabled all other plugins except wp-tables and STB. Still have that same problem of Narrow table.
Thanks.
DaveKat
Total Comments by Davekat: 20
Oh, and look down a little below the black boxes and check the grey boxes. There are no down arrows on the boxes to collapse. also I am not sure what the purpose of the grey box is.
Thanks
Total Comments by Davekat: 20
The grey box is very very special text box … 😉 Only for highlighting WP shortcodes …
Total Comments by minimus: 167
Ok. I get the gray box.
Thanks,
DaveKat
Total Comments by Davekat: 20
Hello, is it possible to change the code, so that the collapsed box, will show the first 220 px of the content, and the rest will appear while expanding it?
Total Comment by Joel: 1
I’m thinking about it…
Total Comments by minimus: 167
I’m having difficulty seeing the caption text and background colour in IE8. I’ve used STB before with other themes, with no problems. I’m currenlty using the Atahualpa theme, which uses tables for layout purposes. Could this be causing the problems? Is there a workaround? Great plugin by the way.
Total Comment by Wyn James: 1
Give me URL of your blog, I want to see what happened…
Total Comments by minimus: 167
I was having the same problem others were having with the Special Textboxes plugin suddenly not working. To fix it, in essence, I deleted all the plugin files, then reinstalled the plugin. Now everything’s lovely again! If you want more details, I wrote a short post on it: Quick Fix: Special Textboxes Plugin Stopped Working. Thanks, Minimus, for a great plugin.
Total Comment by Vernessa Taylor: 1
Thanks a lot! 😉
Total Comments by minimus: 167
Hi,
first congatulation for this very nice and usefull plugin. I’m looking very long Time for those!
My Problem;
Most i put the Box in next-to-last paragraph, but when I do this, it is no Distance between the last 2 paragraphs.
What is the Failure or what is my mistake.
Please help me.
Exuse my bad english, it’s from school long time ago.:)
Total Comments by rauchmelder: 3
Give me the link to page where it’s possible to see this error…
Total Comments by minimus: 167
//harte-zeit.de
Total Comments by rauchmelder: 3
Try adjusting the bottom margin of block on settings page…
Total Comments by minimus: 167
Click on my Name. 😉
Total Comments by rauchmelder: 3
Плагин очень понравился, спасибо! Но, при проверке валидатором w3.org возникают ошибки. Пожалуйста, сделайте чтобы их не было, для этого нужно чтобы теги, в которых прописывается оформленный текст, были заключены во вспомогательные теги object. Сейчас я их прописываю вручную:
Таким образом при проверке валидатором validator.w3.org ошибок нет! Пожалуйста, добавьте тег object в код плагина. Спасибо!
Total Comments by Strikestar: 2
Ok! Сделаю … Кстати, эта статья есть и на русском языке … 😉
Total Comments by minimus: 167
И правда 🙂 Я то думал что плагин зарубежный, а он отечественный) Но судя по множеству комментариев он имеет огромную популярность и у англоговорящих блоггеров. В предыдущем посте я рисунок прикреплял, но что-то видимо не прикрепился. Сейчас и на русском почитаю, чтобы получше разобраться!
Total Comments by Strikestar: 2