WordPress stran v mobile friendly

5 naročnikov

Imam WordPress stran, ki trenutno ni mobile friendly. Rad bi jo naredil mobile friendly, vendar tako, da imam nadzor nad tem, kaj vse bodo uporabniki videli in kako. Trenutno tema ni mobile friendly in je precej customizirana (v bistvu neprepoznavna), z zelo customiziranim cssjem in htmljem ter dodanimi plugini na naslovni strani.

Kaj lahko naredim? Kako na podlagi trenutne teme narediti mobile-frienldy verzijo?
Je kdo tukaj, ki to obvlada? Če ja, se mi lahko javi na PS.

Razni plugini (npr. WPTouch) so zame neuporabni (ali pa jih ne znam uporabiti), ker tak plugin naredi čisto novo stran, ki nima več nobene funkcije s stare strani. Vse kar naredi je, da so posti berljivi, kar pa zame ni dovolj.

"simple" .. media queries pa "lomiš" site kot želiš.. kar ne želiš prikazati pa skriješ..

Nova tema in migracija vsebine ne pride v poštev?
Jaz bi verjetno rajši usmeril energijo v to, da bi obstoječi plugini (ki jih omenjaš) delovali na novi temi, kot pa da bi staro temo spreminjal v responsive (ker je tukaj ogromno spremenljivk, da bo zadeva delovala tiptop).

@ž odvisno.. mi smo kar nekaj WP siteov, ki so sicer katastrofa za pogledat uredili da so responsive.. to pa zato, ker so/smo se bali da bi "pokvarili" SEO, če bi uporabili novo temo..

Vse se da. Treba je:
- najprej narediti mobile layout ~ kako bi naj zadeva sploh naj izgledala na mobile
- narediti css, ki zna delati s stolpci, vsem slikam dodati responsive class (width: 100%; height: auto), po potrebi preurediti še kakšne menuje
- preurediti template html na grid sistem

Css za stolpce:

.grid {
    margin: 0 auto;
    max-width: 950px;
    width: 100%;
}

.row {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 20px;
    width: 100%;
}

.col-1 {
    width: 8.33%;
}

.col-2 {
    width: 16.66%;
}

.col-3 {
    width: 25%;
}

.col-4 {
    width: 33.33%;
}

.col-5 {
    width: 41.66%;
}

.col-6 {
    width: 50%;
}

.col-7 {
    width: 58.33%;
}

.col-8 {
    width: 66.66%;
}

.col-9 {
    width: 75%;
}

.col-10 {
    width: 83.33%;
}

.col-11 {
    width: 91.66%;
}

.col-12 {
    width: 100%;
}

Z css media kveriji rešuješ (skriješ, premakneš, pomanjšaš, itd) še ostalo.

Potem pa imaš content v gridu, vsaka vrstica mora biti row, noter pa imaš col-x, tako da je njihov seštevek 12 (npr za ozek in širok stolpec: col-2 + col-10).

Če imaš bolj kompleksne želje, seveda lahko uporabiš tudi Boostrap framework, kjer imaš vse kar ti srce poželi glede layout možnosti.

Ker dobivam povpraševanja za predelavo strani na responsive - dokler gre za eno ali dve strani, to ni tak problem predelat. Če se pa gre za celoten WordPress template, je pa to skoraj isto (ali slabše), kot da bi pisal template znova in toliko dela in stroškov, da je vprašanje, če se vam izplača obstoječ template predelovat.

Kot je cruiser rekel...
Stroškovno je bolje obstoječi dizajn prenesti na responsive. Torej izdelava nove predloge.

Je pa težko na pamet brez primera.