CSS Grid row classes not being generated properly

darkhousedevelopment
(@darkhousedevelopment)

2 months, 2 weeks ago

I am using the shortcode to add my conference schedule in my page template, but the grid-template-rows CSS attribute on the main schedule div is not being generated correctly.

In your example on your website the grid-template-rows attribute is filled with the specific rows, based on the timestamp of the session, and then each row is assigned to their grid area using those timestamps. Your demo grid has this value: grid-template-row: [tracks] auto[time-1554706800] 1fr[time-1554708600] 1fr[time-1554710400] 1fr[time-1554724800] 1fr[time-1554726000] 1fr[time-1554727200] 1fr[time-1554732000] 1fr[time-1554735600] 1fr[time-1554742800] 1fr

However, in my website the value is simply this: grid-template-rows: [tracks] auto; which makes every single row of the schedule stack on top of each other in the first row.

This is the shortcode I am using:
[wpcs_schedule date="2021-04-13" layout="grid" color_scheme="light"]

Viewing 6 replies - 1 through 6 (of 6 total)

Plugin Author Steve Jones
(@stevejonesdev)

2 months, 2 weeks ago

Hi @darkhousedevelopment,

If you add the parameter tracks=”all” to the shortcode does that fix the issue?

Thanks,

Steve

Thread Starter darkhousedevelopment
(@darkhousedevelopment)

2 months, 2 weeks ago

Hi Steve,

Thanks for the quick reply. So, that did fix the issue with the grid rows CSS, but it has created a new issue.

On my page I am working on I am showing the schedules for a 3 day conference. I have each day under a different tab. It looks like the plugin does not support having more than one schedule on the same page as it just takes the timestamps from the final instance and generically applies those to the .wpcs-schedule div.

Perhaps you could add an update to the plugin that adds a dynamic ID to the .wpcs-schedule div based on the date parameter and then generate the CSS for each instance and apply it to that specific ID.

Plugin Author Steve Jones
(@stevejonesdev)

2 months, 2 weeks ago

The plug should work with multiple schedules on a page. We have it set up with four schedules on our home page. https://wpconferenceschedule.com/

Thread Starter darkhousedevelopment
(@darkhousedevelopment)

2 months, 2 weeks ago

Here is the page I am working on. You can see the styles are all generically just set to .wpcs-schedule so there is no way to create the rows needed for each individual schedule.

https://globalethicssummit.ethisphere.com/agenda-plugin-test/

I am guessing in the demo on your site you are adding 4 versions of the same date’s schedule, which is why the generic styles work on all of your instances, but on mine where they are different days, therefore creating different timestamps, the way the styles are generated breaks them.

uapilot
(@uapilot)

1 month ago

I can confirm that having two or more schedules of DIFFERENT days on the same page are causing problems with a grid-view structure described above. Is it possible to fix this issue?

When you have one table-schedule of events of Day 1 and one grid-schedule of event of Day 2 on the same page the whole thing works fine. If you set them both to grid view – one of them breaks its view.

Moreover, the blocks for Gutenberg editor doesn’t work properly displaying: Error loading block: Invalid parameter(s): attributes which could be done in some other better way.

You can check it on your demo page as well. Just add to the same page different schedules for different days.
Day 1 – session1, session2, session3, etc
Day 2 – session1, session2, session3, etc

Any fixes?
Thanks in advance

Plugin Contributor Amber Hinds
(@alh0319)

3 weeks, 4 days ago

Hi,

Thanks for your patience on this. We are going to look into resolving the conflict and fixing this bug, however, we may not be able to get to it immediately as we have a lot on our plate at the moment.

We may be able to look at this at the end of the week or next week. If your need is urgent you could submit a customization request at https://wpconferenceschedule.com as we’re needing to prioritize paid support at the moment.

Thanks for understanding and I’ll follow up when this has been fixed.