Image header, responsiv twentyseventeen
-
Hej!
• webbutveckling på min egen dator MAMP
• Använder mig av child-theme till twentyseventeenBeskrivning av mitt problem:
Jag försöker ladda upp en image header i wordpress som jag vill ska bli responsiv(fungera i mobil, ipad, dataläge). Men även fast jag fixar till min image header och klipper till den så att det är 2000px i bredd x 1200px i höjd som är för just twentyseventeen temat. Så visas det inte som det ska.
Det jag vill är att visa hela bilden i mobilläget, inte bara en inzoomad bild.(tre hundar är på bilden, den i mitten syns).Jag vet inte vad mer jag kan göra och behöver hjälp.
Vad jag har gjort hittills(massor mer men skriver några):
• Jag har letat massor på google för en lösning och försökt att hitta rätt klass för vart jag ska nå ”image header” och vad jag vet är det:.twentyseventeen-front-page.has-header-image .custom-header-media{ height: 400px !important; // skriv in önskad höjd }
Detta var en av sakerna jag hitta som i alla fall rörde min kod så det hände något men jag har fortfarande samma problem och har hört att
!important
inte är så bra att använda om man inte verkligen måste.• Jag försökte att ändra om bilden i photoshop för att göra den mindre och ha vitt runtom så att den skulle möjligtvis se bättre ut, utan resultat.
• Jag läste på en länk jag hittat på google att twentyseventeen hade svårt med fokuserade image header bilder och själva temat funkade bättre responsivt om det var en dekorerad image header istället? Dock vill jag ha en image header som är på just mina tre hundar, så hur ska jag gå tillväga?
• På en annan länk på google var det om en funktion som hette wp_is_mobile():
if(wp_is_mobile()){ //show image } else{ // show video }
och styla med:
.wp-custom-header iframe, .wp-custom-header img, .wp-custom-header video { display: block; height: auto; width: 100%; height: 400px; }
men jag vet inte om jag är på rätt spår eller om jag tänker för djupt nu?
• Har också försökte när jag trycker på Appearance -> header -> Add new image
att ta crop på själva ”image header” som jag laddat upp men de funkar fortfarande inte att visas som jag vill.Många sökningar senare i google och fortfarande ingen lösning och behöver nu råd och hjälp.
- Ämnet ”Image header, responsiv twentyseventeen” är stängt för nya svar.