Custom Post Type responsiveness & menu problem - Support | Kriesi.at

Viewing 13 posts - 1 through 13 (of 13 total)

Author

Posts
November 19, 2019 at 6:21 pm #1158215
Roberta
Participant
Hi there,

I recently realized we are running into responsiveness issues with our custom post types on mobile devices.

For you to get a sense of what is happening on the front end, I created the exact same page as an enfold “page” and not a custom type page.

Here is the page (which is working perfectly): https://dev-myelitis.pantheonsite.io/test-3/

Here is the custom page one: https://dev-myelitis.pantheonsite.io/clinical-studies-and-trials/the-prevent-study/

The difference I notice on mobile are:
1. The menu breaks on the custom page. You can see this prominently if you try to go to programs and services < individuals. It won’t show up entirely.
2. The responsiveness isn’t really happening on the custom page, look at the padding left and right and compare it to the page one, it isn’t properly being responsive.
3. Functions on the backend — screen options like element visibility on mobile devices isn’t working either. The sections will show even though they are prompted to be hidden depending on the screen size.

I noticed that this happens on all custom page types — we have quite a few. In our child theme, we currently have single .php files for each custom post type that are identical to the page.php files.

What can we do to fix this?

Thank you!
Roberta
- This topic was modified 5 years ago by Roberta.
November 20, 2019 at 7:33 pm #1158577

Victoria
Inactive Moderator

Hey Roberta,

You might want to write to the Ubermenu support or check their docs, we cannot really help you with this plugin.

Best regards,
Victoria

November 21, 2019 at 9:52 am #1158760

Roberta
Participant

Hi Victoria,

Thanks for your response.

The menu problem is only one of the three problems. Like I mentioned in my entry, there are at least two more problems related to the page —page responsiveness and also the avia layout problem (avia sections are still showing when they are asked to be hidden in the avia layout editor). They can all easily be identified by comparing the two pages I sent over in my previous message.

I don’t have enough knowledge on the matter, but what I’m seeing is that the page properties for mobile devices are not being pulled for the custom post types, while we would like them to. The theme is not working as it should on our custom post types on mobile.

I believe something similar as what is mentioned here is going on: https://kriesi.at/support/topic/theme-not-working-with-custom-post-type-and-pages-main-div-closing-too-early/.

Thank you,
Roberta

November 22, 2019 at 5:53 pm #1159250

Victoria
Inactive Moderator

Hi Roberta,

Have you tried the solution posted there?

Could you please attach some screenshots of the issue?

Best regards,
Victoria

November 25, 2019 at 6:55 pm #1159977

Roberta
Participant

Hi Victoria,

I haven’t because it’s a similar issue but not exactly the same. As mentioned in my previous message, the page has exactly the same code/content as the custom post type page. I’m attaching some screenshots below highlighting the issues I found:

1. The issue of the menu getting cut off on the custom post type page. On the normal page, it works fine.

Page — works fine: https://ibb.co/bLFsrTh
Custom Post Type Page — gets cut off: https://ibb.co/SPWQhSJ

2. The responsiveness issue — on the page it is showing correctly, and on the custom post type page, you can see the padding is much narrower.

Page — works fine: https://ibb.co/stGqPvw
Custom Post Type Page — content does not show up properly, see padding-left/right: https://ibb.co/qMgdMv5

3. The issue related to the hiding sections on mobile devices. There is an option in enfold, where sections can be hidden on mobile and tablet devices. If I check the boxes to hide the sections on the custom post type pages, those sections will still show up. https://ibb.co/fS89Trq

I appreciate your help!

Warmly,
Roberta

November 28, 2019 at 12:14 pm #1160916
Victoria
Inactive Moderator
Hi Roberta,

Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
```
@media only screen and (max-width: 767px) {
  div .av_three_fifth {
      margin-left: 0%;
      width: 100%;
  }
}
```
As for the menu being cut-off, it is the parallax section covering it, please disable the parallax effect and see if the issue persists.

If you need further assistance please let us know.
Best regards,
Victoria
November 29, 2019 at 3:47 pm #1161240

Roberta
Participant

Hi Victoria,

Thanks for getting back to me. The code you sent over more or less solved one of the issues —the responsiveness/padding on the side of the page. However, I think this is only a patch solution for this specific page, and won’t necessarily fix all other custom post type pages that have a different layout. I think the problem lies deeper. When I inspect both pages, I am seeing that for some reason, the stylesheet that is being pulled on the custom post type page is different than the one that is being pulled from the standard page one (which works fine). I’m attaching screenshots as an example.

The page that is working like it should: https://ibb.co/KbLkPHP is pulling styles from the grid.css stylesheet
The custom post type page that isn’t working properly: https://ibb.co/6ngJ416 is not pulling from the grid.css stylesheet.

Ideally, we want the custom post type pages to work/look exactly the same as the standard pages so that no errors occur.

I hope this makes sense!

Warmly,
Roberta

December 3, 2019 at 1:47 pm #1162198

Ismael
Moderator

Hi,

Thank you for the update.

Did you register the custom post type using the new filter? Please check the documentation below to learn more on how to properly enable the advance layout builder for the post type.

// https://kriesi.at/documentation/enfold/intro-to-layout-builder/#alb-for-any-post-type

Best regards,
Ismael

May 14, 2020 at 1:31 pm #1212945

Roberta
Participant

Ismael, I’m just seeing this message, I’m terribly sorry about that!

I will look into it and let you know. I definitely think this is an issue with the advance layout builder not being properly enabled (you helped me with a similar issue a couple of days ago). As always, thank you so much for your help. You are all incredible :)

Roberta

May 14, 2020 at 1:43 pm #1212948
Roberta
Participant
This worked, Ismael, thank you SO MUCH!

Just a final question (given my very limited PHP knowledge): is it possible to add more custom post types to this code?
```
function avf_alb_supported_post_types_mod( array $supported_post_types )
{
  $supported_post_types[] = 'YOUR CUSTOM POST NAME';
  $supported_post_types[] = 'YOUR CUSTOM POST NAME';
  return $supported_post_types;
}
add_filter('avf_alb_supported_post_types', 'avf_alb_supported_post_types_mod', 10, 1);
```
I currently have it set to the code below but would like to add more custom post types if possible.
```
function avf_alb_supported_post_types_mod( array $supported_post_types )
{
  $supported_post_types[] = 'clinical-studies';
  $supported_post_types[] = 'clinical-studies';
  return $supported_post_types;
}
add_filter('avf_alb_supported_post_types', 'avf_alb_supported_post_types_mod', 10, 1);
```
Thank you!
Roberta
- This reply was modified 4 years, 6 months ago by Roberta.
May 18, 2020 at 8:45 am #1213940
Ismael
Moderator
Hi,

Thank you for the update.

You can actually replace the value of the second line..
```
 $supported_post_types[] = 'clinical-studies';
```
.. with the other custom post name or slug.
```
 $supported_post_types[] = 'another-custom-post-type';
```
You should end up with this.
```
function avf_alb_supported_post_types_mod( array $supported_post_types )
{
  $supported_post_types[] = 'clinical-studies';
  $supported_post_types[] = 'another-custom-post-type';
  return $supported_post_types;
}
add_filter('avf_alb_supported_post_types', 'avf_alb_supported_post_types_mod', 10, 1);
```
Best regards,
Ismael
May 21, 2020 at 12:13 pm #1214969

Roberta
Participant

Thank you, Ismael, that makes total sense.

Best,
Roberta

May 23, 2020 at 5:23 am #1215352

Rikard
Keymaster

Hi Roberta,

Great, I’m glad that Ismael could help you out. Please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard
Author

Posts

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.