Announcement

Collapse
No announcement yet.

Adding a temporary message to the site to be displayed on each page.

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Adding a temporary message to the site to be displayed on each page.

    To add a temporary message to the top of each of the store pages, follow the procedure below:-

    Go to 'Design | Library | Variables' and scroll down to the 'Other' tab and expand it.
    Click on 'New Variable' and configure it so that it looks like the image below: -

    Click image for larger version  Name:	TempMessageVar.png Views:	0 Size:	76.5 KB ID:	552266

    The repeat the procedure and create a second variable and configure it so that it looks like the image below: -

    Click image for larger version  Name:	TempMessageVar1.png Views:	0 Size:	78.1 KB ID:	552264

    Go to 'Settings | SIte Options | Properties' and scroll down to the 'Other' group and you will see two new entries: -

    Content of Temporary Message
    Display Temporary Message


    In the 'Content of Temporary Message' field enter the message, including HTML that you want to display, in this example the message used is: -

    Code:
    <b>COVID-19 UPDATE:</b> WE'RE STILL OPEN FOR ONLINE ORDERS, DELIVERY TIMES ARE LARGELY UNAFFECTED.
    Then in the field 'Display Temporary Message' change the value to 'True' (when you no longer wish to display the message turn this to 'False').

    Then click on the 'Design' tab and click the 'Code View' button Ensure you are on 'Home' item in the 'Content Tree' and click the 'Up' button:-
    Click image for larger version  Name:	UpButton.png Views:	0 Size:	1.2 KB ID:	552267
    until you are in the 'Outer Layout' (it will be called 'Responsive Outer Layout' in the default site).
    Enter the following HTML just after the <body... tag, approx line: 24 in the default site: -

    Code:
    <actinic:block if="%3cactinic%3avariable%20name%3d%22TEMPMESSAGE%22%20%2f%3e%20%3d%3d%20true"><div class="temp-message"><actinic:variable name="TEMPMESSAGECONTENT" /></div></actinic:block>
    Click 'OK and it should then look like this: -

    Click image for larger version  Name:	TempMessageCode.png Views:	0 Size:	74.7 KB ID:	552268

    Once you have done this, still in the 'Design' tab click the 'Current Stylesheet' button and scroll to the bottom of the layout, create a new line and add the following code: -

    Code:
    .temp-message {
        background: #31b0c9;
        padding: 10px;
        color: white;
        text-align: center;
    }
    and click 'OK'. Obviously you can use whatever colours, text size etc. that you wish.

    Once you have done this, the message will display as shown in the image below: -

    Click image for larger version  Name:	CV19.png Views:	0 Size:	350.4 KB ID:	552269

    NOTE: Prior to doing this it would be prudent to create a backup snapshot of the site, or use a test site first.
    Be aware that this knowledgebase article is provided as a convenience only and using the article is done so at your own risk, Sellerdeck will accept no responsibilty for any problems seen. Additionally this article will not be covered by normal Sellerdeck support.
    Attached Files
Working...
X