Hoi Cathelijn,
Zo te zien verwijst de Facebook knop op de mobiele versie naar https://www.homecarehuisdierservice.nl/www.facebook.com/hchuisdierservice
Dus de juiste link wordt achter jouw site URL geplaatst.
Waarschijnlijk heb je dan als URL achter de knop op de mobiele pagina: www.facebook.com/hchuisdierservice
ingevuld zonder protocol (http / https) er voor.
Als je de link achter de Facebook knop op de mobiele versie vervangt met: https://www.facebook.com/hchuisdierservice
dan zal het weer werken.
-
Deze reactie is gewijzigd 2 jaren geleden door DigitPipe.
-
Deze reactie is gewijzigd 2 jaren geleden door DigitPipe.
Bedankt DigitPipe
Maar dit heb ik al geprobeerd, en helaas werkt de knop nogsteeds niet.
Ook heb ik de knop meerdere keren verwijderd en helemaal opnieuw opgebouwd, maar zonder resultaat.
Is er een andere oplossing misshcien??
Hoi,
Ik kom tot dezelfde conclusie als DigitPipe, lijkt erop dat de FB-link niet juist ingevoerd is.
Jouw thema heeft ook een mobiel stylesheet, heb je die extra WPTouch plugin daar echt nog voor nodig?
Guido
Hoi Guido.
Jammer dat ik geen foto mee kan sturen, dan kan ik laten zien dat echt alleen maar het fb-linkje is ingevoerd. Op de manier zoals DigitPipe zei…
Kan je mij misschien vertellen hoe ik met dit thema een mobiel sheet maak? Want dan lijkt mij dat een goede oplossing 🙂
Hoi Cathelijn,
Je thema heeft dit al ingebouwd (CSS voor mobiele weergave), de meeste thema’s tegenwoordig overigens. Kan natuurlijk zijn dat je niet tevreden genoeg daarmee bent, en wel met wat de WPTouch plugin doet.
Guido
Heel erg bedankt Guido!
Heb je nog een tip hoe ik de indeling voor de mobiel versie overzichtelijker kan maken? De banner en andere afbeeldingen zijn wel erg groot..
Graag gedaan. Probeer deze fix eens voor kleine schermen:
@media screen and (max-width:767px) {
.custom-header {max-height:300px;}
.site-heading {padding-top:50px; padding-bottom:50px;}
}
Voeg dit toe op pagina Extra CSS van de Customizer.
Dit maakt de headerafbeelding bovenaan een stuk lager.
Guido
Dat is al een stuk beter Guido, bedankt voor de tip!
Maar zou u eens mee kunnen kijken op mobiel? De naam van de site in de bannen is nu niet te zien, ik zie alleen het woord ”Home” ivm Home Care Huisdierservice.
En de tekst naast de foto’s op verschillende pagina’s is raar ingedeeld, heel smal (de woorden worden in stukje gehakt).
Is aan deze beide punten nog iets te verbeteren zodat de mobiele versie er netzo goed uitziet als de desktop versie??
Alvast hartelijk bedankt 🙂
Hoi Cathelijn,
Je hebt de header bovenaan nu maar 120px
hoog gemaakt, dat is wel erg laag, met zo’n lange titel.
Je kunt lettertype van deze titel wel kleiner maken, door dit aan mijn eerdere CSS toe te voegen, direct onder .site-heading
:
h1.site-title a {font-size:30px; line-height:1.5;}
Wat de afbeeldingen betreft, ik kan je een fix geven om ALLE rechts uitgelijnde afbeeldingen in klein scherm te centreren zodat er geen tekst meer naast komt. Of CSS voor specifieke afbeeldingen.
Guido
De 120px hoog heb ik gedaan omdat ik alsnog niet de hele header zag op de mobiele versie, alleen het paard een een stukje van de kat waren te zien. Nu is (als het goed is) wel de volledige header te zien.
Ik heb de titel kleiner gemaakt met de CSS, maar helaas zie ik alleen nog maar ”Home Care” en niet de volledige naam. Kunnen we hier misschien nog iets mee??
Is een CSS voor specifieke afbeeldingen ingewikkeld om in te stellen? Het gaat namelijk niet om alle plaatjes op de website.
Alvast mega bedankt voor alle hulp Guido!!
Hoi,
Je hebt de hoogte nu op 120px
ingesteld en boven en onder de titel heb je nu 50px
padding, dus dan houd je maar 20px
voor de titel over. Dat is te weinig. Ik zou de hoogte op minimaal 150px
zetten. Of desnoods de padding verminderen.
Ja, elke afbeelding heeft een eigen ID dus je kunt voor elke afzonderlijke afbeelding CSS toevoegen. Als je bv de bovenste afbeelding op pagina “Even voorstellen” wilt centreren in klein scherm, voeg dit dan toe op dezelfde manier als de andere CSS die ik je doorgaf:
.wp-image-147.alignright {float:none; display:block; margin-left:auto; margin-right:auto;}
Guido
Yesss, ik denk dat het met de header gelukt is 🙂 De titel lijkt in het midden te staan en is helemaal zichtbaar.
Betreft de foto’s met tekst ernaast. De manier met de CSS code, veranderd de indeling dan ook op de desktop versie?? Want dat is niet de bedoeling namelijk. Zoniet, hoe vind ik de bestandsnamen van de overige afbeeldingen.
Als het de indeling met deze CSS ook op de desktop versie veranderd is misschien een fix toch makkelijker zodat alleen de mobiel versie wordt aangepast?
Hoi,
Je moet die CSS dan wel tussen die media query zetten:
@media screen and (max-width:767px) {
// hier als je css
}
om de ID van de afbeelding te vinden, ga met je muis op de afbeelding staan, rechtermuisklik, dan die je bij de class
bv wp-image-408
staan. 408 is dus de ID.
Guido
Gelukt met de foto’s, heel erg bedankt!!!!
Ik zag trouwens met de header dat ik deze alleen heb aangepast op de welkomspagina, kan ik dit trucje vrij simpel aanpassen op alle pagina’s??
Cathelijn
-
Deze reactie is gewijzigd 1 jaar, 12 maanden geleden door cathelijn.
-
Deze reactie is gewijzigd 1 jaar, 12 maanden geleden door cathelijn.
Mooi zo en graag gedaan 🙂
Ik zie dat de site titel op andere pagina’s geen heading H1 is. Dus dan moet je dit nog even toevoegen aan al die CSS die ik je eerder gaf:
.site-title a {font-size:22px; line-height:1.5;}
Guido