How to modify calendar text

  • Resolved marklein

    (@marklein)


    7 years, 1 month ago

    By default the monthly calendar event link displays something like this:

    Event Name
    5:30pm
    High [10]

    It’s that last part that drives me crazy. I know that somewhere in there is “Availability: High” but nobody sees that because it doesn’t fit in the cell and nobody understands what “High [10]” means. I’d like to replace it with something meaningful like “10 seats available”. I tried to use javascript document.getElementsByClassName to replace the contents but something about the fact that the whole thing is inserted by jquery blocks it (as far as I can tell).

    Are there any hooks we can use to modify this? Do you have any other javascript/jquery suggestions to modify this? I don’t want to edit the core files since obviously updates will break it.

    Thanks.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author loushou

    (@loushou)

    Hi @marklein,

    Yes you can override this relatively easily. Look inside our plugin directory, and you will find a sub-directory called ‘templates/qsot-calendar/views’. Inside that directory is a series of files that correspond to the selected view that the calendar is in (which the default view is the ‘month’ view). What you can do is this:

    – in your theme, create a new sub-directory called ‘qsot-calendar/views’
    – copy the month.php file from the plugin sub-directory into your new theme sub-directory
    – make the edits you wish to that theme-side copy of the file

    Now, you are correct that things get added to the calendar using javascript (since the entire calendar page is driven by a third party library called ‘fullcalendar’, which is effectively a jquery plugin). When that happens, the javascript consumes a bunch of data about the event, fills out the ‘template’ with that data, and then adds it to the calendar. Because of this, the javascript must know where to add the certain pieces of data, like the remaining capacity number (the 10 in your example). Thus, if you want to change the verbiage as you defined in your question you need to change the following bit of the template

        <div class="fc-availability">
      <span class="words"></span>
      <span class="num"></span>
    </div>

    to be something like this:

        <div class="fc-availability">
      <span class="num"></span> seats available
    </div>

    Hopefully this helps,
    Loushou

    Thread Starter marklein

    (@marklein)

    Yes that’s a major improvement, thanks for the info.

    Having said that the “num” class is still surrounded by superfluous square brackets. Any way to get rid of those?

    Plugin Author loushou

    (@loushou)

    Hey @rmsgreig,

    Sorry I missed your follow up question. The short answer is that there is not a way to change that currently, without modifying the plugin, or at least copying the script that puts those square brackets in there, and doing some fancy footwork with $wp_scripts to overwrite it.

    In the short term, the easiest way to remove these brackets is to edit the javascript files that adds them, directly in the plugin. Normally, I shy away from suggesting that, since you will have to maintain that change manually every time you update the plugin, but I really don’t see another good way to do it right now.

    You will need to make the following edit:

    File: /wp-content/plugins/opentickets-community-edition/assets/js/features/calendar/calendar.js
Line: 533
Change: remove the '[' and ']' parts, and relevant '+' characters
Final Line: section.find( '.num' ).html( evt.available );

    Hope this helps,
    Loushou

    Thread Starter marklein

    (@marklein)

    Thanks for the info, very helpful. I appreciate your time.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to modify calendar text’ is closed to new replies.