Blogerzy wszystkich platform, łączcie się!

Dyskusje Blogerów, Fotoblogerów i Vlogerów, fora blogowe, graficzne, ogólnotematyczne
rozmowy o blogach, porady, instrukcje, ciekawostki z internetu



::
Autor Wiadomość
fred93 
Blogger.Klub

Dołączył/a: 12 Lis 2013
Posty: 55

Wysłany:    Wyświetlanie bloga w wersji mobilnej

Cześć,
Czy jest jakiś sposób na edytowanie wyglądu bloga w wersji mobilnej? Wyświetla wszystko super, tylko chciałbym się pozbyć narośli blogspota- Czyli wszystkiego tego czego nausuwałem się wcześniej na stronie. Jest na to jakaś rada?
Pozdrawiam.

[ Komentarz dodany przez: Htsz: 2016-08-13, 05:23 ]
zobacz również => ja zablokować ładowanie niektórych elementów szablonu na urządzeniach mobilnych (telefon)?
 
  podziel si� tym postem na:




Utwórz darmowe konto na forum --- Zaloguj się --- Polub Blogowicza na FB!
Dołącz do grupy Bloggerów na FB

Eisen 
Blogger.Klub


Dołączył/a: 29 Sty 2013
Posty: 61

Wysłany: 2013-12-20, 00:02   

hmm

szablon -> na komórkach -> Tak, na urządzeniach przenośnych pokazuj szablon w wersji mobilnej. -> (wybierasz z menu rozwijanego) Niestandardowy

podejrzyj najpierw, czy Ci odpowiada, zanim go ustawisz
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław

Wysłany: 2013-12-20, 08:04   

Można w łatwy sposób zobaczyć jak wygląda nasz blog na urządzeniach mobilnych. wystarczy na końcu adresu dopisać ?m=1 - niezależnie na jakiej podstronie się aktualnie znajdujemy. Przykład: http://jednokolumnowy.blogspot.com/?m=1
Przeglądając bloga na komórce można się również przełączyć do trybu komputerowego, wystarczy dopisać ?m=0.

Nie polecam wyłączania tego całkowicie, szczególnie jak macie szablony, które da się edytować w zakładce Dostosuj. Z jakiegoś powodu jest to ze sobą połączone i po wyłączeniu komórek zmienne resetują się, tracimy edytor wizualny (nie da się nic zmienić w dostosuj). Będę jeszcze o tym pisał w osobnym wątku.

Wracając do edycji szablonu dla wersji mobilnej.

W przypadku szablonów systemowych mamy wydzieloną sekcję w arkuszu CSS, zaczyna się od:

Kod

/* Mobile
----------------------------------------------- */
Możesz modyfikować już dostępne lub wprowadzić nowe. Schemat jest taki sam, jedynie poprzedzasz dany element klasą .mobile
np.

Kod

.mobile .widget h2 {
font-size: 90%;
}
powinien sprawić, że tytuły h2 we wszystkich gadżetach będą miały 90% rozmiaru czcionki zadeklarowanej w elemencie nadrzędnym.

Druga sprawa to kod HTML. Jak przejdziesz w edytorze do sekcji gadżetu Blog1, to zobaczysz, że masz tam includable main, post, nextprev i ich odpowiedniki mobilne: mobile-post, mobile-nextprev, mobile-main, mobile-index-post
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Eisen 
Blogger.Klub


Dołączył/a: 29 Sty 2013
Posty: 61

Wysłany: 2013-12-21, 20:20   

Zmieniłem wartość .header { height:210px;}
w tym

Kod

/* Mobile
----------------------------------------------- */

i strona w normalnej wersji też się zmieniła :/ to może od razu się podepnę, jak ustawić ten header poprawnie, albo w ogóle go usunąć ale tylko dla wersji mobilnej? Oprócz tego stopka postów, gdzie znajdują się napisy Strona główna, Starsze posty w wersji mobilnej są białymi napisami na jasnym tle - źle to wygląda. I napis X komentarze też chciałbym wywalić, bo na głównej mobilnej źle to wygląda moim zdaniem.
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław

Wysłany: 2013-12-21, 22:10   

Napisałem co ma zawierać kod CSS, podałem przykład, wskazałem właściwą sekcję a w niej masz kody dotyczące wersji mobilnej. Zobacz jak są zbudowane (co je łączy) i sprawdź czego brakuje Twojemu kodowi ;-)
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Eisen 
Blogger.Klub


Dołączył/a: 29 Sty 2013
Posty: 61

Wysłany: 2013-12-30, 18:50   

Niestety, próbowałem zmienić tło buttona "Strona główna" i strzałek, czyli odpowiedników "Starsze posty i nowsze posty" w zwykłej wersji, ale zmieniło mi się tło stopki postów.

W tej sekcji się bawiłem:
Wiadomość (widoczna dla zarejestrowanych)

jestem już blisko, ale nadal nie to

A ten header najchętniej bym zamienił na zwykły tekst. W ogóle widziałem Twojego bloga w wersji mobilnej - wygląda bardzo estetycznie. Jak go wycentrować, tak jak jest u Ciebie? U mnie może być trochę inaczej, gdyż jako tło mam ustawiony podłużny, dwukolorowy pasek.
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław

Wysłany: 2013-12-30, 20:48   wyświetlanie gadżetów w wersji mobilnej szablonu

#blog-pager to boks, w którym znajdują się linki do stronicowania. Każdy z nich ma dodatkowo własne style.

Eisen napisał/a:

próbowałem zmienić tło buttona Strona główna i strzałek, czyli odpowiedników Starsze posty i nowsze posty
.mobile .mobile-link-button

sekcje mobile-nextprev oraz nextprev są podobne a linki starsze/nowsze w szablonie na komputery już edytowaliśmy kiedyś, dodawaliśmy do nich grafiki.

Eisen napisał/a:

A ten header najchętniej bym zamienił na zwykły tekst.
Można wyłączyć pokazywanie gadżetu w wersji mobilnej a inny włączyć tylko dla komórek.

Na przykładzie nagłówka:
Przechodzisz do edytora HTML, przeskakujesz do wybranego gadżetu (header1) i dopisujesz:

Kod

mobile='yes'
wtedy będzie pokazywany na komórkach

Kod

mobile='no'
nie będzie pokazywany na komórkach, nawet jeżeli jest ustawiony dla nich automatycznie

Kod

mobile='only'
będzie pokazywany tylko na komórkach
kod poglądowy po zmianach:
Wiadomość (widoczna dla zarejestrowanych)


Eisen napisał/a:

W ogóle widziałem Twojego bloga w wersji mobilnej - wygląda bardzo estetycznie
wersja mobilna z m=1 nie jest przygotowana jeszcze tak jak sobie zaplanowałem. Na razie przystosowałem tę skórkę (jednokolumnowy) do dopasowywania się także pod tablety i telefony w wersji komputerowej m=0.

Eisen napisał/a:

Jak go wycentrować, tak jak jest u Ciebie?
W szablonie systemowym (Rewelacja, Prosty, Okno obrazu itd.) powinno wystarczyć:
Wiadomość (widoczna dla zarejestrowanych)
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Eisen 
Blogger.Klub


Dołączył/a: 29 Sty 2013
Posty: 61

Wysłany: 2013-12-30, 23:19   

Htsz napisał/a:

wersja mobilna z m=1 nie jest przygotowana jeszcze tak jak sobie zaplanowałem. Na razie przystosowałem tę skórkę (jednokolumnowy) do dopasowywania się także pod tablety i telefony w wersji komputerowej m=0.

Jak dla mnie jest bardzo dobrze, nie mogę się do niczego przyczepić ;)

A propos lepszego dostosowania do wyświetlania w telefonie w wersji komputerowej m=0, w tytułach postów, gdzie czcionka jest niestandardowa, nie wyświetlają się polskie znaki (a widziałem, że na jednokolumnowych jest ok). Na m=1 wszystko jest dobrze. No... może prawie, ta czcionka tytułów jest standardowa, nie taka jak w wersji komputerowej - gdzie można to podmienić?

Przy okazji, te nagłówki postów i widżetów (z ustawioną czcionką niestandardową) ładują się czasami, ale styl tej czcionki się nie zmienia, jest jakiś zwykły arial czy coś takiego... (lecz dzieje się tak tylko sporadycznie). Na początku myślałem, że w kodzie jest jakaś luka, ale ostatnio myślę, że może to być wina laptopa.

No i dzięki za odpowiedź, wersja mobilna jako tako nabiera kształtów. Jednak jak usunąłem header, nie ma żadnego napisu, nic : D Jest wielka pustka. Pomyślałem, że ze zwykłym tekstem byłoby nadal pusto, chciałbym tam zamieścić header, ale w wersji mobilnej - odchudzony. W jakich wymiarach go stworzyć i jak najlepiej dopasować? Tą szerokość, co oddziela menu od góry strony (w której miejscu był header) można ustawić? Najładniej IMO wyglądałby pasek kolorowy pod menu nawigacyjnym (Strona główna, etc), a nad nim grafika dla wersji mobilnej. Mam nadzieję, że wiadomo o co chodzi i nikt się w tym tekście nie pogubi :>
Aaa no i tło, po tych zmianach źle wygląda. Gdzie je podmienię dla m=1? Najlepiej też na jakiś pasek, z tym że inaczej rozmieszczony (ciemniejsza jego część na szerokości wpisów, a jaśniejsze poza - z tym, że skąd mam znać konkretne wymiary? już są inne od układu szablonu w wersji komputerowej). W ostateczności może być zwykły #hex, jak za dużo z tym zabawy :)

uff, trochę się rozpisałem
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław

Wysłany: 2014-02-22, 04:05   

Eisen napisał/a:

czcionka tytułów jest standardowa, nie taka jak w wersji komputerowej - gdzie można to podmienić?
skorzystaj z narzędzia "zbadaj element", to dowiesz się jaką ma klasę lub identyfikator a potem dopisz odpowiedni styl w arkuszu CSS - według schematu jaki omawialiśmy wyżej.

Eisen napisał/a:

Pomyślałem, że ze zwykłym tekstem byłoby nadal pusto, chciałbym tam zamieścić header, ale w wersji mobilnej - odchudzony. W jakich wymiarach go stworzyć i jak najlepiej dopasować?
pisałem o gadżetach widocznych tylko w wersji mobilnej, o obrazkach dopasowujących się do szerokości ekranu też już dyskutowaliśmy na Blogowiczu.

Eisen napisał/a:

Aaa no i tło, po tych zmianach źle wygląda. Gdzie je podmienię dla m=1?
odpowiedni CSS w sekcji mobilnej arkusza stylów.
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Vess 
WordPress.Klub


Dołączyła: 02 Lip 2015
Posty: 24

Wysłany: 2015-08-18, 21:31   

Posty pisane dawno temu, ale bardzo mi się przydały. Wreszcie udało mi się ogarnąć widżety w mobilnym szablonie. Wielkie dzięki.
______________________________________________________
Lubujesz się w fantastyce? Szukaj Czerwonego Piachu.
Próbujesz pisać dla internetu? Tu znajdziesz kilka osobistych porad.
 
  podziel si� tym postem na:
Htsz 
Blogger Product Expert
Blogowicz.Team


Zaproszone osoby: 84
Imię: Arkadiusz Narowski
Pomógł: 816 razy
Wiek: 38
Dołączył/a: 01 Sty 2006
Posty: 8948
Miasto: Wrocław

Wysłany: 2015-08-18, 21:53   

Włączanie lub wyłączanie gadżetów przyda się osobom, które przygotowują oddzielne wersje blogów na komórki.

Dorzucam info z pomocy bloggera:

Cytat

mobile – (opcjonalny) może mieć wartość „yes” (tak), „no” (nie) lub „only” (wyłącznie), przy czym domyślna to „default” (domyślnie). Od tego zależy, czy widżet będzie wyświetlany na urządzeniu przenośnym czy nie. Gdy atrybut mobile ma wartość „default” (domyślnie), na urządzeniu przenośnym będą wyświetlane elementy Header (nagłówek), Blog (blog), Profile (profil), PageList (lista stron), AdSense (reklamy AdSense) i Attribution (informacje o autorstwie).
źródło: https://support.google.co...wer/46888?hl=pl

-------------------

Ja aktualne staram się optymalizować i tworzyć szablony RWD, czyli elastyczne.
______________________________________________________
nie radzisz sobie? :arrow: pomoc indywidualna oraz blogi i strony na zamówienie
zapraszam do przewodnika po forum oraz grupy Blogger Polska! na fb

Think before you post™ | ^_^ na każdego posta znajdzie się riposta™

Jeżeli nasze posty pomogły rozwiązać Twoje problemy możesz odwdzięczyć się, udostępniając link do tego forum na swoim blogu, fanpejdżu lub stronie!
Nie zapomnij kliknąć
lubię to! na facebooku. :^^:
 
  podziel si� tym postem na:
Vess 
WordPress.Klub


Dołączyła: 02 Lip 2015
Posty: 24

Wysłany: 2015-08-19, 22:58   

Kurczę, nie wiem, czy to po tych zabiegach, ale w tej chwili mogę już tylko wrzucić widżety w Układzie - i nie jestem w stanie zrobić z tym nic więcej. Jeśli próbuję je przesuwać i zapisać, widzę tylko

Cytat

Wystąpił błąd. Odśwież stronę i spróbuj ponownie.
Z kolei jeśli wcisnę podgląd, wyskakuje biała stron i wielgachne

Cytat

Szablon został zaktualizowany w innym miejscu. Załaduj oryginalną stronę ponownie i spróbuj jeszcze raz.
Error 500.

Czy to może być wina bawienia się widżetami od htmlowej strony zamiast w Układzie? Kompletnie nie wiem, co się wydarzyło.
______________________________________________________
Lubujesz się w fantastyce? Szukaj Czerwonego Piachu.
Próbujesz pisać dla internetu? Tu znajdziesz kilka osobistych porad.
 
  podziel si� tym postem na:
Wyświetl posty z ostatnich:   
::
Odpowiedz do tematu
Nie możesz pisać nowych tematów. Zobacz szczegły.
Nie możesz odpowiadać w tematach. Zobacz szczegły.
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach
Nie możesz załączać plików na tym forum
Nie możesz ściągać załączników na tym forum
Dodaj temat do Ulubionych
Wersja do druku

Skocz do:  

Powered by phpBB & Weblove.pl © 2006-2024 Wrocław | modified by Przemo © 2003 phpBB Group.
skocz na górę   |  shoutbox
 
Dodaj na Facebooku:

Zobacz także:


Szablony blogów i stron na wordpress
ogromna baza motywów WP, podzielona na kategorie tematyczne. Proste, jednostronicowe wizytówki lub zaawansowane układy, także z funkcją sklepu internetowego (ecommerce).
Wyszukaj na Blogowiczu:
snapchat blogowicz instagram blogowicz