|
Anwar
|
December 26, 2015 at 1:07 pm
Hi, I have a ‘mobile first’ development strategy. I purchased EE WP users to enable logged in users to view their events, this works fine, except on mobile devices (I use iPhone 4 as my base test), the table is not displayed in a responsive way. Is there anything I can do to ensure that this sceen is responsive in the same way as the other screens are?
Kind Regards
Anwar
|
|
Anwar
|
December 27, 2015 at 6:45 am
Hi, I have had another look at EE WP Users, apparently the default template is table, but their is an option – I tried [ESPRESSO_MY_EVENTS template=event_section] without success? I am not sure if this syntax is allowed or even correct?
|
|
Lorenzo Orlando Caum
|
December 27, 2015 at 2:32 pm
Hi Anwar,
The parameter description was switched so its incorrect. I’ve corrected it in the documentation.
Could you try this out?
[ESPRESSO_MY_EVENTS template=simple_list_table]
—
Lorenzo
|
|
Anwar
|
December 28, 2015 at 3:41 am
Hi Lorenzo,
Thank you for your reply, I tried [ESPRESSO_MY_EVENTS template=simple_list_table], but no luck. Still a table view, anything further I can try?
Kind Regards
Anwar
|
|
Josh
|
December 28, 2015 at 3:28 pm
Hi Anwar,
Have you tried viewing the page on your mobile device with the twentysixteen WordPress theme activated?
|
|
Anwar
|
December 29, 2015 at 4:18 am
Hi,
At your suggestion I have tried on twentysixteen theme and on my iPhone4 it still does not size properly. Although on Chrome, Mobile/RWD tester appears fine. Anything else I can try. Also the event details are supplemented with a colour coded key, i.e. green is approved. I think this is a lot of information for a user to take in. Can parts or all be moved under a more details button?
|
|
Josh
|
December 29, 2015 at 8:26 am
Any of the columns can be hidden with CSS. You can also copy the template over to your active WordPress theme (we recommend using a child theme) then remove the unwanted columns by editing the template.
The template that’s the simplest to work with is the simple list table, and it’s broken up into two parts:
loop-espresso_my_events-simple_list_table.template.php
content-espresso_my_events-simple_list_table.template.php
For collapsing columns you can install the standalone Footables WordPress plugin, which allows you to easily include and configure the FooTable jQuery script into your site.
Then you can add the specific data attributes on the table to define which columns will be visible at the different breakpoints.
|
|
Anwar
|
January 6, 2016 at 12:57 pm
Hi,
Sorry for delay in reply. Thank you for reply. I am not a WP expert or programmer, so whilst the information above is excellent I will not be able to put it into practice until I become more familiar and skilled in WP.
The full information that is provided [ESPRESSO_MY_EVENTS] is a great. It is only because it does not size properly on my iPhone that I have an issue, and the reason that I have the issue is because I have made a pledge to my users that the site willl operate as ‘mobile first’. Therefore if there is already a way that [ESPRESSO_MY_EVENTS <some argument>] that should provide an alternative view I would very much like to get the simple solution working.
In the longer term I will use the information above to create a bespoke solution and will advise you when/if I am successful along with details for your knowledgebase.
Kind Regards
Anwar
|
|
Lorenzo Orlando Caum
|
January 6, 2016 at 1:29 pm
Hi Anwar,
I didn’t see your earlier comment about the shortcode not working. Could you double-check that you are on the latest version of the WP Users integration?
If you are not sure, then what is the version number that is shown in your Plugins screen?
This shortcode should show you a more compact display:
[ESPRESSO_MY_EVENTS template=simple_list_table]
—
Lorenzo
|
|
Anwar
|
January 7, 2016 at 1:54 pm
Hi Lorenzo,
I believe I am using the latest version of WP Users Integration, 2.08.p.
I have tested with [ESPRESSO_MY_EVENTS template=simple_list_table], gives a nice view, with colour coding. With [ESPRESSO_MY_EVENTS] only more information is presented. Unable to send you screen-shots here, but their is a difference so the shortcode is working.
Unless you are able to assist further I think that I will have to look for a fix for iPhone 4 display myself, but many thanks for your assistance. A great help.
Kind Regards
Anwar
|
|
Lorenzo Orlando Caum
|
January 7, 2016 at 6:10 pm
Hi Anwar,
I have an iPhone 5 that I could use to help troubleshoot this. We’ll need to drop one of the columns to make room though as the screen width isn’t enough to show all of that information.
Which column could you do without when this shortcode is in use?
[ESPRESSO_MY_EVENTS template=simple_list_table]
—
Lorenzo
|
|
Anwar
|
January 9, 2016 at 7:03 am
Hi Lorenzo,
Yes, because this is a table there is no other option but to drop a column to fit?
If it helps for testing you can create an account on my website http://topacademy.uk and register on the test event. Then from the Logout drop-down menu you can select My Events. For testing this will list the events in both default and simple types for comparison.
I think the most obvious column to remove is Locations.
I notice that actions on the default and simple types show pending and approved respectively – not sure why there is a difference. Also the there is a cog on the default version and icons on the simple, perhaps cogs would also be better on the simple. The name ‘Title’ is also missing on the simple version.
Just very grateful for your assistance in getting an iPhone4 UI for this part of your application.
Kind Regards
Anwar
|
|
Lorenzo Orlando Caum
|
January 9, 2016 at 1:08 pm
Hello Anward,
Could you try adding this CSS to your site via your theme’s stylesheet or a free plugin like Simple Custom CSS:
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2) {
.espresso-my-events-table.simple_list_table_table td:nth-child(4) { display:none; }
.espresso-my-events-table.simple_list_table_table .espresso-my-events-location-th { display:none; }
}
—
Lorenzo
|
|
Anwar
|
January 10, 2016 at 8:40 am
Hi Lorenzo,
That works. The display fits onto the portrait window of iPhone 4. Thank you for going out of your way to assist. Just one slight issue which may be a bug? The word ‘Title’ does not appear in the heading of the table. If so perhaps a small fix for the next release of WP User Integration?
Obviously in the longer term I will look for a grid based responsive solution, but in the meantime I am able to continue to claim mobile compliance for all UI screens.
Kind Regards,
Anwar
|
|
Lorenzo Orlando Caum
|
January 11, 2016 at 11:28 am
Hi Anwar,
That may be expected (appearing with no heading). I’m not entirely sure so I’ve asked a team member for feedback. You can use a filter to change it:
https://gist.github.com/lorenzocaum/01fc67648345123d570a
—
Lorenzo
|
|
Anwar
|
January 14, 2016 at 12:59 pm
Hi Lorenzo,
The code worked for me. Not sure the reason to have a blank heading but this code resolves the issue. Much obliged.
Kind Regards
Anwar
|
|
Lorenzo Orlando Caum
|
January 14, 2016 at 1:36 pm
Thanks for confirming Anwar. Removing the heading was done in an earlier version of the add-on. We are discussing restoring it back to show Title.
I’ll update your support post to resolved.
If you need help with anything else, then please create a new support post here:
https://eventespresso.com/support/forums/
—
Lorenzo
|
