Okay
  Public Ticket #1623927
Calendar Display Broken
Closed

Comments

  • simplydesigning started the conversation

    Hello,

    The formatting of the calendar is broken when I insert into my site. Please advise.  I can provide wp login access if needed.  Thank you in advance.

  •   simplydesigning replied privately
  •  94
    Valentin replied

    Can you tell me what was the problem with the layout and how you fixed it to see if there is no problem on our end?

    About the import problem I've already assigned it to the developer and hope to come with solution or explanation as soon as possible.

    Stachethemes Support
    My Time Zone is GMT+3


    Envato Profile | Facebook | Twitter | Newsletter | Rate & Review

  • simplydesigning replied

    Initially, the layout was broken due to the <pre> tags before and after the shortcode. After reading the articles I was able to see them by switching to text mode instead of visual.

    Secondly, I am using the Infinite Wordpress Theme by Goodlayers and I wanted to embed the shortcode in a widget so I could place it in certain locations on my site.  The GDLR styles were conflicting with the calendar styles and creating spacing issues within the widget so I added the following custom styles in Fonts & Colors to fix the display.

    .gdlr-core-page-builder-body p { margin-bottom: 0px; }

    .infinite-body, .infinite-body p, .infinite-line-height, .gdlr-core-line-height {
        line-height: 1.3; }

    .stec-layout-event-preview-left-text-title { position: relative; top: 0px; }


  •  94
    Valentin replied

    I see, thank you! Unfortunately css conflicts some times are unavoidable with open source projects.

    Stachethemes Support
    My Time Zone is GMT+3


    Envato Profile | Facebook | Twitter | Newsletter | Rate & Review

  •  94
    Valentin replied

    Good morning!

    To fix the problem with the google import will have to add one filter. 

    Open your theme functions.php file and at the end add:

    add_filter('stec_event_get_front_data', function($data) {
        $data['description'] = html_entity_decode($data['description']);
        return $data;
    });
    Please let me know if the problem persist.

    Stachethemes Support
    My Time Zone is GMT+3


    Envato Profile | Facebook | Twitter | Newsletter | Rate & Review

  • simplydesigning replied

    Thank you for the code.  I placed it in the functions.php file and it helped when I re-imported the events.  The content is displayed on the FRONT end without the HTML tags, however, it is still retaining some formatting from google (see http://school.holytrinitysp.org/athletics/athletics-calendar/ and click the  "New Parent & Student Orientation" event. Additionally, when viewing the description in the event editor, the HTML code is still there.

    Ideally, during the import, all formatting is removed and only plain text remains. This will allow the styling of the site to display the plain text properly.  Then, if needed, the user can apply formatting to the text by editing the event.

  •  771
    Zhivko replied

    Could  you send me your ics file for testing purpose?


    Stachethemes Developer

  •   simplydesigning replied privately
  • simplydesigning replied

    Did further testing and looks like it is working on the front end!  Thank you!

    I entered new descriptions in a couple of other dates and I noticed that the formatting was working on import.  I then went back to the event that was having formatting issues and deleted the text completely in google calendar, then saved.  I then re-typed the text in the google calendar description and clicked the "remove formatting" icon (I previously did this but it didn't seem to help).  Then I re-imported and overwrote all events.  All worked!

    Test #2: I then went back to google calendar and formatted the text using the rich text editor and created a link as well.  Then re-imported and overwrote all events.  This also worked and the formatting transferred over perfectly!  

    Test #3: Removed the code you provided from my theme's functions.php.  The formatting that was done in google calendar was now displaying as HTML code.  Once I put the code back in the functions.php file, the text displayed perfectly, so that code definitely fixed the issue.

    Conclusion: It is possible that when the event was originally created in google calendar, the description was cut from a web page and pasted into the description (this was done by another person, so I am assuming).  Although I clicked the "remove formatting" icon in google calendar, the formatting likely remained because it did not originate from the google rich text editor.  That resulted in the embedded HTML code transferring over during the import (the text had a gray background color).

    REMAINING ISSUES: 

    1.) Calendar editor still displays the raw imported HTML code in the Visual Tab. (Note: when you switch to Text Tab the code brackets < > are missing from the tags for the imported code, but display in the Visual Tab)

    2.) Unordered lists and ordered lists display properly in the back-end editor, but do not display properly on the front-end.

    3.) Horizontal Line displays in the back-end editor, but does not display on the front end.

    See: http://school.holytrinitysp.org/athletics/athletics-calendar/ (click "Test Event") for front-end display.

    Sorry for the long-winded response, but I thought this info might be helpful. Thanks again!

  •   simplydesigning replied privately
  •  94
    Valentin replied

    No, Thank you for the amazing feedback! 

    Stachethemes Support
    My Time Zone is GMT+3


    Envato Profile | Facebook | Twitter | Newsletter | Rate & Review