Jeden z czytelników mojego bloga poprosił mnie żebym napisał poradnik, jak dodać kod mapy google na bloga. Jeśli również masz z czymś problem i chciałbyś zobaczyć jego rozwiązanie na moim blogu, skontaktuj się ze mną.

Wpis archiwalny. Treść może być nieaktualna.

Aby dodać mapę Google na blog/stronę, przejdź na stronę http://mapy.google.pl/ w polu wyszukiwania miejsce, które chcesz wyświetlać na swojej stronie, czy blogu. Kiedy już wszystko przygotowałeś, czas na przeniesienie kodu twojej mapy na stronę/bloga.
W tym celu kliknij w prawym górnym rogu mapy LINK i skopiuj zawartość jak poniżej.

[img]

Jeśli chcesz umieścić kod mapy na blogu WordPress, masz możliwość zrobić to na kilka sposobów.

Umieszczanie mapy Google na podstronie w WordPress

• zaloguj się do panelu administracyjnego
• wybierz zakładkę Strony i kliknij Dodaj nową
• Teraz wybierz Źródło dokumentu lub strony w swoim edytorze i wklej tam swój kod:

[img]

• Odznacz źródło dokumentu i wyrównaj swoją mapę. Dodaj tytuł swojej strony, np. „dojazd” i kliknij Opublikuj.
• Możesz również zmieniać rozmiar w kodzie mapy Google (width-szerokość oraz height-wysokość).

Umieszczanie mapy Google jako widżet na blogu

• Aby umieścić kod mapy Google w widgetach na blogu wybierz z panelu administracyjnego WordPress Wygląd, a następnie Widgety.
• wybierz z dostępnych widget oznaczony jako Tekst (możesz wkleić tam dowolny tekst lub kod HTML) i przeciągnij go do swojego paska

[img]

• otwórz widżet Tekst, który umieściłeś w swoim pasku widżetów i wklej tam swój kod pobrany z Google maps.
• dopasuj szerokość i wysokość tak, aby zachowana była estetyka strony ( <iframe width=”425” height=”350„) edytuj tylko parametry podświetlone na czerwono tak, aby dopasować rozmiar mapy do szablonu strony.

Możesz również dodać google mapę do wpisu podobnie jak przy dodawaniu kodu mapy na stronę statyczną w WordPress.

Widzisz, że dodawanie mapy Google na blog nie jest wcale takie straszne, jak się wydaje. Czasami szablony oferują po bokach dodatkowe szerokie pola, gdzie można  wklejać grafikę, więc możesz to wykorzystać i wkleić tam kod swojej mapy.

Jeśli masz jakieś pytania czy problem z dodawaniem map, napisz mi w komentarzach, a odpowiem ci na nie 😉

Wpis archiwalny. Treść może być nieaktualna.

Ostatnio stopki w motywach WordPress coraz częściej są rozbudowywane (dotyczy motywów klasycznych – classic themes). Coraz więcej motywów oferuje w stopce różne widżety. Możemy umieszczać informacje o sobie, kategorie wpisów, archiwum i inne gadżety. Nie ukrywajmy, ta funkcja uatrakcyjnia bloga i pomaga mu być bardziej przejrzystym.

Wiele motywów nadal nie oferuje możliwości dodawania widżetów w stopce. Jednak jest możliwość stworzenia sobie samemu możliwości dodawania tych widżetów. Jest to wbrew pozorom nietrudna sprawa.

Potrzebujesz edytować 3 pliki:

• functions.php,
• footer.php
• oraz style.css.

To wszystko! Pamiętaj jednak, aby wykonać edycję poprawnie, podążaj za wszystkimi moimi wskazówkami. Do edycji plików polecam używać bardzo dobrego programu Notepad++.

Jak zatem dodać paski dodawania widżetów do stopki w WordPress?

Wpis archiwalny. Treść może być nieaktualna.

Jeśli już posiadam np. 2 paski boczne w swoim motywie i chcę, aby w stopce wyświetlały się 3, potrzebuję razem 5 pasków dodawania widżetów (Jeśli nie wiesz ile ich masz, otwórz w Panelu Administracyjnym Wygląd -> Widgety. Tam zobaczysz, ile posiadasz pasków).

Jeśli dla przykładu chcę wyświetlać w stopce 4 paski z widżetami i domyślnie w motywie posiadam 2 paski, razem będę potrzebował 6. Dlaczego o tym piszę? Jest to ważne przy edycji pliku functions.php. My będziemy się trzymać tej wersji z 5 panelami (2 boczne + 3 w stopce).

Edycja pliku functions.php

Plik functions.php znajdziesz w katalogu:

/wp-content/themes/TWÓJ_MOTYW/

Jeśli twój motyw nie posiada pliku functions.php, (a masz możliwość dodawania widżetów w motywie), po prostu utwórz go i wklej do niego poniższy kod. Oczywiście, jeśli chcesz mieć w sumie 4,6 czy więcej widżetów, zmień liczbę w podanym kodzie na optymalną dla ciebie i wklej do pliku functions.php:

<?php
if ( function_exists('register_sidebar') )
register_sidebars(5,array(
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h4>',
'after_title' => '</h4>',
));

Następnie musisz pokazać, gdzie twoje nowe paski z widżetami będą wyświetlane na stronie. Aby widżety poprawnie wyświetlały się w stopce, potrzebujesz zmienić troszkę plik footer.php.

Edycja pliku footer.php

Otwórz plik footer.php i zaraz  nad tą linijką:

<div id="footer">

Dodaj poniższy kod:

<div id="footer-sidebar" class="secondary">

<div id="footer-sidebar1">
<?php if ( !function_exists('dynamic_sidebar')
|| !dynamic_sidebar(3) ) : ?>
<?php endif; ?>
</div>

<div id="footer-sidebar2">
<?php if ( !function_exists('dynamic_sidebar')
|| !dynamic_sidebar(4) ) : ?>
<?php endif; ?>
</div>

<div id="footer-sidebar3">
<?php if ( !function_exists('dynamic_sidebar')
|| !dynamic_sidebar(5) ) : ?>
<?php endif; ?>
</div>

</div> <!-- Close footer-sidebar -->

<div style="clear-both"></div>

Oczywiście możesz zmieć „id” pasków w stopce. Ja u siebie wstawiłem footer-sidebar, jednak jeśli chcesz, możesz wstawić swoją nazwę.

Potrzeba jeszcze dodać trochę stylów dla twoich widżetów, aby były wyświetlane poprawnie i przejrzyście. W tym celu konieczna jest edycja pliku style.css.

Edycja pliku style.css

Otwórz plik, najlepiej programem Notepad++ i znajdź kod odpowiadający za prawidłowe funkcjonowanie stopki. Prawdopodobnie przed kodem znajdziesz linijkę:

/* Footer */

Pod tą linijką umieść poniższy kod (jeśli nie ma takiej linijki, to dodaj kod na samym dole pliku):

#footer-sidebar {
border: 1px solid #cccccc;
display:block;
height: 260px;
}

#footer-sidebar1 {
float: left;
width: 300px;
margin-right:20px;
}

#footer-sidebar2 {
float: left;
width: 300px;
margin-right:20px;
}

#footer-sidebar3 {
float: left;
width: 300px;
}

Możesz oczywiście edytować kolor tła, wysokość, szerokość, wyrównanie oraz marginesy. Tutaj zamieściłem najczęściej występujące rozmiary dla poszczególnych pól z widżetami, dlatego powinno być wszystko OK. Co o tym sądzisz? Jeżeli masz jakiś problem u siebie, opisz go w komentarzu.

Wpis archiwalny. Treść może być nieaktualna.

Wpis archiwalny. Treść może być nieaktualna.

Na pewno zastanawiałeś się nad tym problemem, co robić z wolno działającym blogiem. Czasami tak jest, że strony wczytują się długi czas, często tracisz cierpliwość. Dobrze działający i szybki blog to podstawa. Sam miałem już kilka takich przypadków, że wchodziłem na daną stronę, która niestety ładowała się wieki, po czym traciłem cierpliwość i ją wyłączałem.

Jeśli chcesz, żeby twojego bloga czytało sporo ludzi, musisz zadbać o ich komfort. Wielu czytelników niecierpliwi się już po krótkim czasie.

W czy leży zatem przyczyna powolnego ładowania?

Czasami problem jest z hostingiem (potrafi on stwarzać niezłe problemy). Często ludzie mają problem po nieprawidłowej instalacji czy konfiguracji wtyczek i motywów. Dlatego uważnie czytaj dokumentację, jeśli nie jesteś pewny jak je instalować i konfigurować.

Czasami jednak wydaje się być wszystko OK, a twój blog i tak nie pracuje tak, jakbyś ty sobie tego życzył. Poniżej opisałem kilka naprawdę cennych porad, które w 100% polecam każdemu blogerowi.

Zoptymalizuj motyw, którego używasz

Pierwszą rzeczą, którą powinieneś wykonać przy optymalizacji jest edycja pliku header.php
Abyś nie miał problemów z podstawowymi informacjami, w standardowych szablonach istnieją odsyłacze do bazy danych, skąd przekazywane są informacje do szablonu. Ta funkcja oczywiście wymaga tabel w twojej bazie danych ( im więcej, tym gorzej krótko mówiąc ). Dlatego pierwszą czynnością, którą zalecam bo uruchomieniu szablonu jest właśnie wpisanie odpowiednich danych w pliku header.php. Zobaczmy na przykładzie mojego szablonu:

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
 <head profile="http://gmpg.org/xfn/11">
 <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

Nie lepiej ustawić w ten sposób?

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
 <head profile="http://gmpg.org/xfn/11">
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Wzorując się na przykładzie, możesz również:

• Ustawić stały link dla RSS (feed)
• ustawić stały link dla arkuszy stylów
• ustawić stały link dla pingback
• ustawić stałe słowa kluczowe
• ustawić stały opis dla bloga

Kiedy ustawisz wszystko, jak opisałem, będziesz mógł usunąć z bazy danych nawet 11 zapytań (queries), co naprawdę o wiele przyspieszy twój szablon.

Edycja pliku footer.php

Większość szablonów posiada „odsyłacze” do bazy danych również w pliku footer.php, które również możesz ustawić jako stałe, sugerując się przykładem edycji z pliku header.php.

Czasami jednak plik ten jest zakodowany, ponieważ autor chce zachować swoje linki w stopce twojego szablonu. Jednak jeśli posiadasz szablon z możliwością edycji pliku footer.php, polecam ustawić stałe linki lub usunąć stamtąd linijki z linkiem do kanału RSS, komentarzy RSS czy nazwy twojego bloga.

Jeśli chcesz jeszcze zoptymalizować swojego bloga, przeczytaj mój pierwszy artykuł o optymalizacji bloga.

Jeśli chcesz, abym pomógł ci zoptymalizować twój blog, napisz do mnie wiadomość. W przyszłości ukarze się ebook o optymalizacji WordPressa (głownie pod wyszukiwarki) z którego dowiesz się wiele fantastycznych porad i ciekawostek. Aby być na bieżąco, zapisz się na biuletyn NETblogera – od zera do blogMASTERA, a otrzymasz wiele cennych porad i wskazówek na temat blogowania.

Wpis archiwalny. Treść może być nieaktualna.