Shortcodes – common mistakes

 > Posts > FAQ > Frontend > Shortcodes – common mistakes

Chronosly shortcodes

If you need to insert (embed) your event list, calendar, and other Chronosly elements you can use Chronosly shortcodes.

There are shortcodes available for all Chronosly elements with the exception Categories (at the moment not available):



Shortcodes - Most common mistakes

There are some common mistakes that you should avoid when inserting shortcodes into your pages. First is related with quotation marks ", and second with date range.




WordPress only accept programming quotation marks.
Be careful to insert programming quotation marks instead of formatted:

Shortcodes quotation marks warning




Is quite common that if you copy paste shortcode from FAQ, sometimes WordPress also copy html code that shouldn't be inserted in your page.

You should insert just plain text, if not, html code would be also included. This example below shows a shortcode that include html tags <pre> and </pre>:

<pre>[chronosly type="event"]</pre>


How to check if shortcode include html code

To check if shortcode is correctly inserted just shift your page setup display from "Visual" to "Text" and it shouldn't include html tags e.g. <pre> <em> <strong>


After copying a shortcode for Chronosly Shortcode page:

Chronosly Shortcode page copying and pasting


In "Visual" view (top right corner), if shortcode is pasted during page set up, it could seem it's correct, but html tags are hidden:

Shortcode with hidden html tags


In "Visual" view, just check left bottom corner, where you can find hidden tags, in this case there are <pre> html tags.

How to detect html tags - HTML tag displayed in "Visual" view
HTML tag displayed in "Visual" view


Switching to "Text" view (top right corner) <pre> or other html tags are displayed.

How to detect html tags - HTML tag displayed in "Text" view
HTML tag displayed in "Text" view


Just delete all those html tags that create shortcode misfunctions.

How to detect html tags - Correct shortcode without html tags
Correct shortcode without html tags




If you insert a shortcode without forcing any date range as this one:

[chronosly type="event"]

shortcodes will display same format you set in Chronosly settings tab.

(Chronosly > Settings > Events display section)

So, if shortcode displays "NO EVENTS FOUND" probably current data range (month view is set by default) has no events.




There are 2 different ways to avoid your event list don't find events or calendars display your default format (year, month, week...)


3.1 Force date within shortcode

chronosly-tips-logoWe highly recommend using UPCOMING parameter and a day range you want to display (upcoming days can be any positive number, e.g 30 for one month):

[chronosly type="event" upcoming="30"]


If you force a date like month, year, week within each shortcode it will remain static, because you will have to change it when it expires.

[chronosly type="event" month="8"]



3.2 Force date within settings

You can set different event list display (check how to set event list display - FAQ) like year view or Upcoming events (days you want to show e.g 90 days for 3 months in advance).

  1. Go to Chronosly > Settings > Events display section
  2. Set wished option in Main event list display


Set main event list display - Chronosly event list settings




This is most versatile option and allow you to display as many events (in days) as you wish.

  1. Set "UPCOMING" option in Main event list display
  2. Set number of DAYS range to show all your events


Set main UPCOMING events in Chronosly event list settings