Print Page - How to add HTML editor to custom fields input area?

Title: How to add HTML editor to custom fields input area?
Post by: John Lee on October 29, 2019, 08:21:47 AM

Hi friends,

I am new here and know very few about code, currely I am using Joomla! 3.9.12 + VirtueMart 3.6.2 10159.

I had managed to add new tabs to the product detail page by adding below codes (for example, add a tab named "Download"):

Code Select


   <li role="vm-tab">
    < a href=" " aria-controls="vm-product-download" role="tab" data-toggle="tab">
     <?php echo vmText::_('Download') ?>
    </ a>
   </li>

Code Select


            <div id="vm-product-download" class="tab-pane" role="tabpanel">
                  <?php 
    echo shopFunctionsF::renderVmSubLayout('customfields',array('product'=>$this->product,'position'=>'prodDownload'));
                  ?>             
            </div>

I can input simple words in the custom field and make it displying at the position 'prodDownload', my question is, how to setup the custom field input area to be a HTML editor, where I can input any texts, tables, images, links, etc, like the Product Description editor?

Thank you.

John Lee

Title: Re: How to add HTML editor to custom fields input area?
Post by: Studio 42 on October 29, 2019, 12:59:31 PM

HTML cannot be saved by default in Virtuemart.
You need to code your own Virtuemart customfield plugin.

Title: Re: How to add HTML editor to custom fields input area?
Post by: John Lee on October 31, 2019, 02:30:40 AM

Hi,

Thank you for your reply.
Is there any other way that I can input tables, links or images in the new created tab?

John Lee

Title: Re: How to add HTML editor to custom fields input area?
Post by: StefanSTS on October 31, 2019, 07:54:55 AM

EDIT: See PRO's answer for the best possible solution. STS

You can use the custom field "Textarea".

Just go to Custom Fields in VM Menu, click new and choose "Textarea".

There is probably a way to add the default Joomla text editor for it, but I never tried, so you might search the Joomla or VM code for how it is done there.

Regards
Stefan

Title: Re: How to add HTML editor to custom fields input area?
Post by: PRO on October 31, 2019, 18:18:16 PM

Use custom field "Editor"

It shows just a regular text area in the "default"

But when you go into product backend, you see the editor

Title: Re: How to add HTML editor to custom fields input area?
Post by: John Lee on November 01, 2019, 05:21:10 AM

Hi Pro,

Many thanks for your information.
I tried many times but it is still only showing a regular text editor in the product backend custom field edit area as below:

(http://www.lyintl.com/images/2019/20191101115023.png)

I find below post and also tried the method:

http://forum.virtuemart.net/index.php?topic=138647.0

But it seems created a new editor instead of call the build-in TinyMCE, see below:

(http://www.lyintl.com/images/2019/20191101120702.png)

And the custom fied edit area disply like this:

(http://www.lyintl.com/images/2019/20191101121326.png)

Is there any way to make this editor looks like the regular TinyMCE editor as below?

(http://www.lyintl.com/images/2019/20191101121606.png)

Thanks.

Title: Re: How to add HTML editor to custom fields input area?
Post by: Studio 42 on November 01, 2019, 18:41:45 PM

You have to customize the editor plugins. See the tinyMce website for all plugin options.
Note that images upload is perhaps not possible

Title: Re: How to add HTML editor to custom fields input area?
Post by: John Lee on November 04, 2019, 05:13:50 AM

I have managed adding some other tools according to TinyMCE documents:
https://www.tiny.cloud/docs/advanced/editor-control-identifiers/#toolbarcontrols

Thank you.

John Lee

VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: John Lee on October 29, 2019, 08:21:47 AM