How do we enable html tags in fields setup "description" box?

[Zahari M.]

Hi Guys!

Been working on building my admin interface and it's coming along great!

So, as the question asks.... is it possible to enable html tags to be recognized in a fields description box? How could I do this?

The reason for this is that I would like to add a link to an internal page for documentation / clarification purposes for a site admin and place it right beside a checkbox or select...

Something like...

<strong>Featured Image Display Options.</strong>
Default: Display Featured image in listings only.
Help: <a href="pwrocks.com/help/featured_image">Featured Image Options</a>

Anyone know how?

Cheers guys!

[Martijn Geerts]

Say you have a max of 20 images per page,

I would say take a repeater with a image field allowing 1 image and an url field. 

(what do I say repeater )

If there are more images, I should make a template with an url field and a image field allowing 1 image.

structure it like:

[ images ] <- page used as folder

   \ [ image ] <- page with 1 image & url field.

     [ image ] <- page with 1 image & url field.

     [ image ] <- page with 1 image & url field.

     [ image ] <- etc.

     [ image ] <- You can insert other fields to, those fields can be used as meta data. 

     [ image ] <- Say you add a select dropdown with "brands", then you can "tag" your photo's: Select: Microsoft or Google (if they are in the select) then you can query your photo's on those tags to.

[Zahari M.]

Hi Martijn!

Learning so much from ya. Thanks a bunch!

I guess I poorly worded my question. I think a screen shot is in order!

 

Trying to add some html into this area !

Any ideas how?

Cheers!

[Martijn Geerts]

I don't know if I understand you correctly.

I think you can add HTML by adding an InputfieldMarkup to your template with the api (I never have tried it and not possible through the admin)

If you want to have instructions or whatsoever (is that a good word?) You can use Markup style links [instructions](http://lmgtfy.com/?q=instructions)

in your descriptions.

[Zahari M.]

Hi Martijn

Thanks for the reply.

Apologies for not describing my question clearly enough! Silly me!

So Martijn, what I am trying to do is work out how to allow the standard admin interface to accept html tags in the description box whenever when we create a new field.

Lets try a better screenshot!

Make sense?

I tried following your link but didnt quite understand it!

Sorry... Im a very very slow learner.

Any ideas how we can modify the core files to allow this?

Cheers!

[Soma]

There is no way to allow html in there so you can't enable it. Markdown links are supported as martjin wrote previous post.

[Zahari M.]

Ah thanks guys!

I get it now!

Solved!

Ok...for future reference for the .01% thick dummies club members like me... go visit this page:

http://daringfireball.net/projects/markdown/basics

Adding this to my description field:

Featured Image Display Options.
Default: Display In Excerpts.
Confused? [Click here](http://majini.org/ ).

Gave me this...

Thanks again Martijn and Soma!!

You guys rock!

[Zahari M.]

Update & Contribution

For any one else interested, I noticed that when it comes to ProcessWire translating Markdown to html in our field descriptions, the only syntax that it will recognize is the Markdown syntax for inline links.

I really would have liked ProcessWire to have supported Markdowns "strong emphasis" triggered by wrapping text around a pair of asterisks.

Digging around further I found a comment by Soma here:

http://processwire.com/talk/topic/1116-render-html-in-field-descriptions/?hl=markdown#entry27976

So after lots and lots of Googling, this was found:

http://stackoverflow.com/questions/4019187/php-preg-replace-to-turn-xyz-to-bxyz-b

So.... going to wire/core/Inputfield.php

I added this immediately after line 628:

$str = preg_replace("/\*\*(.*?)\*\*/", "<b>$1</b>", $str); 

And Voila... I can now emphasize text in my descriptions!!

Going into /wire/templates-admin/styles/main.css and adding something like this...

.description b {
    	color: #444444;
    	font-family: "Helvetica Neue", Arial, sans-serif;
    	font-style: normal;
    }

Ends up giving me this:

Hope this helps someone...

PS You may prefer using <strong> instead <b>

Cheers

[bernhard]

for reference here my very basic module to replace [tags] in description with any code: https://processwire.com/talk/topic/11208-inputfieldtagreplacer/

[bernhard]

just for the record, it is possible to add html to description via hook without messing around with str_replace or the like:

$this->addHookBefore('InputfieldPage::render', function($event) {
        $field = $event->object;
        if(!in_array($field->name, array(
            'fieldname1',
            'fieldname2'
            ))) return;

        $field->entityEncodeText = false;
        $field->description .= ' <a href="#">test</a>';
    }

 

[adrian]

Another option is to use the "Allow HTML" setting in this module: http://modules.processwire.com/modules/dynamic-description-notes/