positie verplaatsen module in responsive

Beste,

Ik heb een site met recepten etc..
Deze site wordt veel via de mobiel bekeken wat erg fijn is.
Nu gaat de zoekfunctie in de responsive mode onderaan de recepten staan.
Hoe kan ik de zoek module naar boven krijgen.
Ik kan niet goed vinden welk bestand bepaald waar wat komt te staan als hij responsivew gebruikt.

Het gaat om website Ursie.nl

Ik hoop dat jullie me opweg kunnen helpen.

Hallo,

ik kan je wel een stukje op weg helpen

Probeer bestaande zoekmodule alleen zichtbaar te laten voor desktop/laptop

Voor mobiel/tab maak je een kopie van je zoekmodule en deze ken je toe aan positie 17 ursie.nl/?tp=1

Dit topic op het Engelse Forum helpt je ook verder.
Daar spreken ze over hidden en visble daar moet je het mee kunnen oplossen.

Succes ermee.

Groeten Ron

Ik snap wat je bedoeld en denk ook dat dit de juiste weg is.
Alleen lukt het niet.
Ik heb in de Suffix vermeldt <space>hidden-phone, maar er veranderd niets.
meerdere geprobeerd <space>visible-dekstop....met zonder <space> met zonder "." etc......
Het lijkt wel of de bootstrap niet werkt.
Enig idee hoe ik kan zien dat deze werkt, misschine met een test of iets.

Groeten, Rico

Artisteer werkt niet met bootstrap. Dus je zult zelf de bijbehorende media queries aan moeten maken.

aha daar was ik al bang voor.

Dan moet ik dus in de custom.css

Is dat genoeg of moet ik dan even goed iets in de suffix van de module melden?

Jouw query is niet volledig

En daarna bij suffix <spatie> hidden-phone instellen.

hmmm....ik snap het niet, het werkt nog niet zoals ik verwacht had.

In de module "Slim zoeken" op postie 7 heb ik in de Module class achtervoegsel <spatie>hidden-phone gezet.
Die werkt goed, in de desktop versie zie je hem en op de phone niet meer.
Dit is de code die ik gebruikt hebt in de template.responsive.css
Om nu de copy van module Slim zoeken die op positie 17 staat alleen zichtbaar te maken op de phone, heb ik daar in de Module Class achtervoegsel <spatie>visible-phone geplaatst. Maar dat werkt dan weer niet en hij blijft dus wel zichtbaar op de desktop.

Alles staat nu nog zoals hierboven beschreven.....enig idee?

Dat komt omdat de code niet goed is. Gebruik de code die ik gegeven heb telkens voor 1 class.

Iets niet weergeven op phone, geef je de Module class achtervoegsel <spatie>hidden-phone. De module staat dan uit op media tot 320 pixels breed.

Wil je iets niet weergeven op een tablet, dan geef je de Module class achtervoegsel <spatie>hidden-tablet. De module staat dan uit op media tussen 320 en 1200 pixels breed.

Wil je iets niet weergeven op een desktop, dan geef je de Module class achtervoegsel <spatie>hidden-desktop. De module staat dan uit op media vanaf 1200 pixels breed.

En visible-desktop staat op display:none, dus dat zal niet werken, nee

Voor phone een query met max 320 maken en daar de code inzetten en voor desktop query min 768. Wat daartussen zit is een ipad.