deactivate responsiveness possible?

[Marion]

I would like to know if and how it is possible, to deactivate the responsiveness of the theme, if wanted.
Thanks for support in advance!
Marion

GP Premium 1.2.94

[Leo]

Hi Marion,

Give this plugin a shot: https://wordpress.org/plugins/generate-disable-mobile/

Also most browsers on mobile will have an option to request the desktop site these days.

For example, using Chrome if you tap the three vertical dots, you’ll see the “Request Desktop Site” option.

Hope this helps!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Marion]

thanks a lot for the fast reply. The plugin is a niceandeasy way to do it, but I would like to deactivate the responiveness only for tablets, if possible. I couldn´t find the code for the viewport tags in the theme. Maybe you can tell me, where to edit this?

[Tom]

What exactly about the responsiveness on tablets are you wanting to disable? The menu? Sidebars?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Marion]

The sidebars: At the moment I would like to prevent the sidebars from slipping under the content on a tablet device, even in the portrait modus. I am trying to learn a little bit more about programming and it would be fantastic to know where to find all the code for that.

[Leo]

Hmm I think sidebars shouldn’t slipped under the content on tablet device?
It should take up 25% of the width on tablet unless the tablet resolution is smaller than 768px

This is the code:

@media (max-width: 1025px) and (min-width: 768px) {
    .tablet-grid-25 {
        float: left;
        width: 25%;
    }
}

Can you provide a link to your site?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Tom]

Depends on the orientation.

If it’s landscape it will use the desktop style, if it’s portrait it will use the mobile style.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Marion]

trying to explain more exactly: EVEN IN PORTRAIT MODUS ON A TABLET I would like to have the sidebar BESIDE content instead of below the content.
I already noticed that this works in the landscape modus.
Sorry for my poor english, maybe this causes some misunderstandings 🙂

@Leo: where should I insert the above mentioned code? If I put in in the style.css of my child theme (I also tried with plugin “Simple custom css”), it seems to have no effect
my site is marion-birkner.com

[Leo]

You explained fine 🙂

Looks like you are only using right side bar on a couple of pages. Can you try this CSS below instead. Adjust the max-width px number as needed.

@media (max-width: 1025px) and (min-width: 600px) {
  .content-area, .sidebar {
    float: left;
    width: auto;
    left: auto;
    right: auto;
  }
  .content-area.grid-65 {
    width: 50%; /* Adjust to 100 - your sidebar percentage */
  }
  .sidebar.grid-35 {
    width: 50%; /* Adjust to your sidebar percentage */
  }  
  .separate-containers .inside-right-sidebar {
    margin: 8px 8px 8px 8px; /* Adjust to separating space value */
  }
}

Let me know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Marion]

no effect at all – unfortunately
isn´t there a possibility to try (and error) somewhere in the code directly? I could experiment in my child-theme a little bit, if I knew WHERE to fiddle…

[Leo]

How are you adding the code currently? I don’t see them being added?

You might also have to play with the max-width px number a bit depending on which tablet resolution you are using…as far as I understand..

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Marion]

Yes, I deleted the code after it didn´t work. Now I have inserted your code again to my css to let you see.
I have tried different numbers of max-width. As you can see below, the system doesn´t agree with the notation somehow:

When I tried different notations like @media screen…, the system did agree with the notation but nevertheless didn´t implement it.

[Leo]

Adjusted the code above. Got the media query wrong before I think..
Can you give it another shot?

Try adding it in Simple CSS if you can.
https://docs.generatepress.com/article/adding-css/#simple-css

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Leo]

I just edited again. Missed a bracket..

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Marion]

I have inserted the last version of your code 🙂
As you can see above, the system again does not agree with the notation.

btw: I am testing with an iPad Air (2048 × 1536 Pixel, 264 ppi /Retina Display)

Good night for today from Germany, maybe better luck next time.

[Author]

Posts