Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

If you are not already using this functionality, you will need to enable it first. To do this you should click the link on the existing custom text screen (highlighted below).

NOTE: Once you have upgraded to the new editor, you will not be able to revert to the old one. You existing custom text is not affected.

Image RemovedThis is feature is not available for Core clients, you will not see this option in your menu. You also have the ability to create bespoke custom text homepages for groups of contractors. Go to bespoke contractor dashboards on how to assign homepages. 

Table of Contents
maxLevel1

Custom Text Screens

Above the menu you will see> Custom Text. You will be presented with a list of screens where custom text can be added, similar to the below.

Image RemovedImage Added

Select the screen you want to edit. The new editor is a WYSIWYG (What You See Is What You Get) HTML editor.

Image RemovedImage Added

A full user guide for the editor can be accessed by clicking the help icon (highlighted below) icon Image Added in the toolbar and following the link displayed.Image Removed

You can preview your custom text at any point by clicking the Preview button. The current custom text will be displayed at the bottom of the screen.

Note: If custom text has been enabled on the worker dashboard you must have [summary] underneath the custom text to have the dashboard widgets displayed below the custom text. 


Including Images In Your Custom Text

To add an image to your custom text you will first need to upload it by clicking the green Upload Images button. This is available from the list screen and from within the edit screen.

...

It is possible to add a carousel (also known as an image slider) to your custom text screens. To achieve this you will need to be comfortable editing html source code. You will also need to have some images uploaded to use within the carousel. From the editor toolbar click the Source button and button Image Added and paste in the relevant html source. Example carousel source code is shown below:

<div data-carousel-delay="3000" data-carousel-height="200" data-carousel-width="1200" id="carousel">
    <div class="cover" style="font-family:gotham; font-size:15px;">
        <div class="carouselpanel">
            <table>
                <tbody>
                    <tr>
                        <td>
                            <img border="0" height="200px" src="/uploadedImage/view/image1.png" width="900px" /></td>
                        <td style="padding:20px;">
                                                       
                            <p style="font-size:20px; padding-bottom:20px;">
                                1 Lorem Dolor Ipsum...</p>
                            <p>
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit</p>
                                        </td>
                    </tr>
                </tbody>
            </table>
        </div>                
        <div class="carouselpanel">
            <table>
                <tbody>
                    <tr>
                        <td style="padding:20px;">
                            <p style="font-size:20px; padding-bottom:20px;">
                                2 Lorem Dolor Ipsum...</p>
                            <p>
                                Etiam tempor condimentum tristique.</p>
                        </td>
                        <td>
                            <img border="0" height="200px" src="/uploadedImage/view/image2.png" width="900px" /></td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>


Related Topics

Custom Text Screens