A 3 legjobb ingyenes CMS weboldal készítéshez

Facebook Tweet Tetszik

0

2018. június 12. - GeorgeL

A CMS (Content Management System) avagy a tartalomkezelő rendszer napjaink egyik leggyakoribb módja a webhely futtatásának. A weboldalak közel 50% -a használ CMS-t rendszert. Ezek a komplex rendszerek egyszerű kezelhetőséget biztosítanak neked a web oldalad elkészítésére és karbantartására.

Rengeteg CMS rendszer áll rendelkezésre a piacon. Azonban megtalálni a neked legmegfelelőbbet nem mindig egyszerű. Ebben szeretnék egy kis segítséget nyújtani. Az alábbiak a legnépszerübb és egyben a legszélesebb körben használt tartalomkezelő rendszerek napjainkban.

1. WORDPRESS

Ha CMS rendszerekről beszélünk az elsők között kell megemlíteni a Wordpress-t. A teljes Internet több mint 25%-a WordPress alapú website! Valamint az összes CMS alapú website több mint 50% -át adják a Wordpress-re épülő weboldalak. A népszerűsége ellenére azonban mégsem biztos hogy, számodra is a legjobb választás.

Tökéletes: bloggerek számára. Minden alapértelmezett beállítás a WordPress-ben a bloggerekre van szabva. Telepítés után szinte azonnal indíthatod is a blogodat. Legyen az bármilyen típusú blog, a WordPress kiváló választás!

Jó: általános web oldalakhoz, egyszerűbb web áruházakhoz. A WordPress kiválóan alkalmas olyan általános weboldalak üzemeltetésére amelyek gyors betöltést és egyszerű kezelhetőséget kívánnak. A WordPress használata egyszerű a kezdőknek és széleskörű testreszabást tesz lehetővé a profik számára.

Ha szükséged van extra funkcióra, akkor több mint 45 000 plugin közül választhatsz. Fejlesztők százezrei építenek plugineket és frissítik a platformot. A Wordpress mögött az egyik legnagyobb fejlesztői és felhasználói közösség áll. Ha bármilyen probléma merül fel biztos lehetsz benne, hogy valaki tudja rá a megoldást!

Rossz a következőhöz: Komplex, összetett weboldalak. A WordPress weboldalak egyik leggyakoribb problémája a pluginok inkompatibilitása. Tíz bővítmény használata még nem feltétlenül, de annál több már potenciálisan okozhat problémákat.

Minden egyes plugin extra kódot ad a Wordpress forrás kódjához, ezzel növelve a weboldal betöltési idejét.

Amennyiben régi plugineket nem távolítják el a könyvtárból könnyen lehet véletlenül újra telepíteni egy elavult bővítményt, amely a weboldal összeomlásához vezethet. A bővítményeket rendszeresen frissítik, de minden egyes frissítés kockázatot hordoz magában. Ellenben ha nem frissíted őket lehetőséget adhatsz a hackereknek, akik a plugin biztonsági hibáját kihasználva, könnyedén indíthatnak támadást a web oldalad ellen.

Röviden, ha olyan weboldalt futtatsz, amely sok extra funkciót igényel, a WordPress valószínűleg nem a legjobb fogadást.

2. DRUPAL

A Drupal a másik legelterjedtebb, legsokoldalubb ingyenes CMS platform. Azonban ennek a sokoldalúságnak az ára a kód komolyabb, mélyrehatóbb ismeretének szükségessége. Ellentétben a Wordpress-el a Drupal-t meg kell tanulni “fejleszteni”.

Tökéletes: összetett, sok funkciót igénylő web oldalakhoz. A Drupal a funkcionalitás közvetlenül a dobozból kínálja, ellentétben a Wordpress-el aminek ehhez több tucat pluginra van szüksége. Széles körű támogatást nyújt a közvélemény kutatások, podcastok, felhasználói menedzsment, vitafórumok stb. számára. A Drupal-ban még az iparági szabványok, mint a szöveg, a képek és a videók is extra figyelmet kapnak.

Jó: (Hobby) Coderek számára. Amennyiben jártas vagy a HTML, CSS és a PHP nyelvekben, akkor készíthetsz weboldalakat és managelheted a tartalmat úgy, ahogy egy egyszerűbb CMS-el, mint például a WordPress, nem tudnád megtenni. A felhasználói felületet aránylag könnyen meg lehet szokni de találni fogod, hogy lényegesen többet kell dolgoznod ha extra funkciókat akarsz az oldaladhoz adni (a Drupal körülbelül egyharmad annyi pluginnal rendelkezik mint WordPress). Azonban a Drupal lehetővé teszi a pluginek szűrését is, így beállíthatod, hogy csak az aktív, fejlesztés alatt álló pluginokat mutassa.

Rossz: újoncoknak, kezdőknek. A legtöbben arra panaszkodnak,, hogy a Drupal nehezen használható. Azok, akik nem ismerik a tartalomkezelő rendszerek működését és nincs tapasztalatuk a kódolásban, nehezen tudják megvalósítani a elképzelésüket a Drupal-ban.

A Drupal a CMS rendszerek piacának mindössze körülbelül 5% -át fedi le, így nem áll mögötte akkora fejlesztői közösség mint amivel a WordPress büszkélkedhet.

3. JOOMLA

És végül a középső gyermek. A Joomla fejlettebb szolgáltatásokat kínál mint a WordPress, de észrevehetően kevesebbet, mint a Drupal.

Tökéletes: azok számára, akik kicsit többet akarnak kihozni web oldalukból mint amennyit a WordPress-el tudnának elérni. A Joomla jó néhány olyan beépített funkcióval rendelkezik, amelyeket csak pluginok segítségével tudnál a WordPress-hez adni. (Mint fentebb említettem a túl sok plugin használata problémát jelenthet a Wordpress alapú weboldalak működésében) Például a SEO funkciók közvetlenül be vannak építve, valamint nagyon egyszerű az új sablonokat készítése is. A Joomla mögött álló fejlesztői közösség nem olyan nagy mint a WordPress-é, ezért nem talál annyi plugint, kiegészítőt, de a Joomla sokoldalúsága segíthet enyhíteni ezen a problémán.

Jó: akiket megrémített a Drupal. Egy kis időre van szükség a Joomla kezelőfelületének megtanulásához de sokkal könnyebb a használata a Drupalhoz képest. Nem olyan széleskörűen testreszabható mint a Drupal, de azok számára, akik nem rendelkeznek kódolási ismeretekkel, a kompromisszum megérheti.

Rossz: azok számára, akik mindkettőt szeretnék: könnyű kezelhetőség és maximális funkcionalitás, testreszabhatóság. A Joomla rendszerint az összes kereskedelem jackpotja, de nem a mester. A Joomla funkcionalitását bővítheted pluginokkal, de közel sem olyan mértékben, mint amennyire a WordPress bővíthető. A második legnépszerűbb CMS-ként elég nagy fejlesztői és felhasználói közössége van, de nem akkora, mint amekkorával a WordPress rendelkezik. A másik oldalon a Drupal, amil számos kategóriában felülmúlja a Joomlát azonban használata szakértelmet és gyakorlatot igényel.

Összegezve

A WordPress a legjobb a bloggerek számára és kiválóan alkalmas a egyszerűbb funkciókat igénylő web oldalakhoz.

A Drupal magas szintű ellenőrzést biztosít a bonyolult web oldalakon, de előzetes ismeretekre és elkötelezettségre van szükség a használatához.

A Joomla jó közbenső, ha a WordPress nem elég jó és / vagy a Drupal túl bonyolult, nehezen érthető, kezelhető számodra.

Happy coding!

Kod Akademia

Szólj hozzá!

WordPress logó testreszabása, eltávolítása az admin eszköztárról

Facebook Tweet Tetszik

0

2018. június 11. - GeorgeL

1. Wordpress logó eltávolítása

Az alábbi kód segítségével könnyedén eltávolíthatod a WordPress logót az Admin Bar-ból. Az egyetlen dolog, amit tenned kell, illeszd be ezt a kódot functions.php fájlba.

function annointed_admin_bar_remove() {
       global $wp_admin_bar;

       /* Remove WP logo */
       $wp_admin_bar->remove_menu('wp-logo');
}
add_action('wp_before_admin_bar_render', 'annointed_admin_bar_remove', 0);

2. Egyedi logó beillesztése

Először is el kell készítened és mentened az egyedi logódat custom-logo.png néven a számítógépeden. A logó méreteinek pontosan 16 x 16 képpontnak kell lennie.

Miután elkészítetted saját logódat, fel kell töltened azt a / wp-content / themes / your-theme / images mappába FTP segítségével. Ha a theme-ed nem rendelkezik / images mappával, létre kell hoznod.

Miután feltöltötted az egyedi logódat, egyszerűen csak add hozzá ezt a kódot a functions.php fájlhoz.

function wpb_custom_logo() {
echo '
<style type="text/css">
#wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
background-image: url(' . get_bloginfo('stylesheet_directory') . '/images/custom-logo.png) !important;
background-position: 0 0;
color:rgba(0, 0, 0, 0);
}
#wpadminbar #wp-admin-bar-wp-logo.hover > .ab-item .ab-icon {
background-position: 0 0;
}
</style>
';
}

//hook into the administrative header output
add_action('wp_before_admin_bar_render', 'wpb_custom_logo');

Remélem, hogy a cikk segítséget ad, hogyan törölheted vagy adhatod hozzá egyedi logódat az admin bar-hoz, hogy ezzel is kicsit személyesebbé tehesd WordPress oldalad admin felületét.

Happy coding!

www.kod-akademia.hu

Szólj hozzá!

Wordpress Web programozás Web fejlesztés

8 nagyszerű ingyenes CSS és Javascript framework animáció készítéséhez

Facebook Tweet Tetszik

0

2017. december 17. - GeorgeL

A modern frontend webfejlesztés szinte elképzelhetetlen animációk nélkül. Amíg 10 évvel ezelőtt még mindenki statikus weboldalakat tervezett manapság, 2017-ben, már “digitális gépeket” készítenek több ezer izgő-mozgó alkatrésszel.

Ehhez nyújtanak segítséget az alábbi CSS és Javascript framework-k (könyvtárak), megkönnyítve és felgyorsítva a webfejlesztés folyamatát.

Animate.css

Könnyen használható cross browser CSS könyvtár. Az egyik legnépszerübb és elterjedtebb a webfejlesztők körében.

Hover.css

CSS3-al készült effekt könyvtár, linkek, gombok, logók, SVG, képek és még nagyon sok egyéb elem animálásához. Letölthető a Github-ról CSS, Sass és LESS támogatással.

Bounce.js

A Bounce.js egy Javascript könyvtár amely segítségével gyönyörű CSS3 animációkat készíthetsz. Elérhető a Github-on.

CSShake

Egy CSS könyvtár, szintén a Github-on, hogy mozgásba hozd az (HTML) elemeid!

Buttons

A Buttons CSS könyvtár segítségével könnyedén készíthetsz testreszabható, flexibilis és modern gombokat a weboldaladhoz. Sass és Compass alapú. Támogatja a négyzetes, lekerekített sarkú és kerek gombok készítését.

A beépített változók segítségével segyszerűen testreszabhatod, megváltoztathatod a gombok színét, méretét, alakját, a gombokon használt címkék betűtípusát valamint a gombokon alakalmazott effekteket.

Kite

A Kite CSS könyvtár egyszerű és praktikus, könnyű értelmezni és használni.

CSS Animation

A CSS Animation könyvtár cssanimation.css mindössze 84kb és 300 animációt tartalmaz. Igazi csemege lehet a webfejlesztőknek.

ReboundGen

Szép animációk a Facebook Rebound.js könyvtárára építve. Hasonlít a fentebb említett Animation CSS-re.

Végszó

Ezzel elérkeztünk összeállításunk végére. Remélem tetszett és találtál olyan könyvtárat amit szívesen kipróbálnál esetleg fel is használnál a következő projektedben!

Happy coding!

Szólj hozzá!

SSL tanúsítvány – röviden

Facebook Tweet Tetszik

0

2017. december 05. - GeorgeL

Mit jelent az SSL tanusítvány?

Angolul, az SSL rövidítés jelentése Secured Sockets Layer. Röviden, az SSL egy olyan tanusívány, ami arra szólgál, hogy az információt tároló kiszolgáló-server és a honlapot látogató felhasználó böngészóje közötti kapcsolatot titkosítsa így illetéktelenek nem tudnak ebbe belelátn. Meglétét egy weblapra kívülről ránézve úgy látod, hogy Amennyiben egy weboldal SSL tanúsítvánnyal rendelkezik a linkje https-sel kezdődik sima http helyett, valamint egy kis zöld lakat és a “Biztonságos” szó is látszik a böngésző címsorában.

Ez a titkosított kapcsolat lehetőséget ad a személyes adatokhoz való biztonságos hozzáféréshez anélkül, hogy ez harmadik személy tudomására jusson. Az SSL technológiát honlapok milliói alkalmazzák, ezzel biztosítva vásárlóik pénzügyi tranzakcióinak védelmét. Fontos tulajdonsága a tanúsítványnak, hogy – mivel a tanúsítvány magánkulcsa csak a szerveren, egy példányban található meg -, a felhasználó számára egyértelműen azonosítja az adott szervert, így a felhasználó biztos lehet abban, hogy nem térítették el az adatforgalmát más szerver felé.

De mi van akkor ha az én oldalamon nincs semmilyen pénzügyi szolgáltatás, nem kérem el a látogatók adatait? Szükségem van ebben az esetben az SSL tanúsítványra? Nos, a válasz igen. Na nem kell mindjárt rohannod de ha hosszútávon gondolkozol mindenképpen szükséged van rá. Ugyan is a Google kijelentette 2016-ban, hogy fokozatosan bevezetik, hogy a https-es oldalakat előnyben részesítik a keresőben! Ez pedig azt jelenti üzleti szempontból, hogy az oldalad ha nem rendelkezik SSL tanúsítvánnyal SEO szempontjából hátrányba kerül a keresőkben. Mondjuk oldald csak a kereső 3-4 oldalán jelenik meg. Odáig pedig csak kevesen lapoznak el. Azért ne ijedj meg! Ez nem megyik napról a másikra fog bekövetkezni! De, tudnod kell róla és jobb ha előbb teszed meg a szükséges lépéseket mint később.

A legtöbb tárhelyszolgáltató manapság már kínálja ezt a szolgáltatást. Vannak ingyenes de vannak fizetős változatai is.

A legszélesebb körben (tárhelytől függetlenül) elérhető ingyenes SSL szolgáltatás a Let’s Encrypt. A többek közt a Mozilla, a Chrome, a Facebook és az Electronic Frontier Foundation által finanszírozott ingyenes szolgáltatás már 2015 decembere óta létezik. Az egyetlen kikötés, hogy a Let’s Encrypt segítségével beszerzett Domain Validation (DV) tanúsítványokat 90 naponta meg kell újítani, azonban ez akár teljesen automatizáltan is elvégeztethető a szolgáltatás linuxos kliensprogramjával. (forrás: PC World)

Az SSL tanusítvány előnyei

Biztos és titkosított kapcsolatot biztosít.
Védi a személyes adatokat az esetleges támadás ellen. Egy ilyen támadást akkor indíthatnak például, amikor az Ön weboldala hitelkártya-sorszámokat tartalmaz.

Happy coding!

Szólj hozzá!

A weboldal autómatikus frissítése a Javascript setInterval() és visszaszámláló használatával

Facebook Tweet Tetszik

0

2017. december 04. - GeorgeL

A JavaScript setInterval() metódus segítségével hívhatsz egy függvényt vagy végrehajthatsz egy általad megadott kódot, meghatározott időközönként. Ebben a bejegyzésben mutatok két egyszerű példát arra, hogyan tudod frissíteni vagy újratölteni a weboldalt minden 10. másodpercben a JavaScript setInterval()használatával és hogy tudod megállítani a frissítést a clearInterval() segítségével.

A setInterval() metódusának szintaxisa

Window.setInterval(code, delay)

A code reprezentálja a futtatni kívánt függvényt vagy egyéb kódot
A delay határozza meg mennyi késleltetés legyen a code futtatása előtt, ezredmásodpercben megadva

A setInterval() mindaddig hívja a függvényt (code), amíg a clearInterval() meghívásra nem kerül, vagy az ablak be nem záródik.

Az alábbi példámban egy függvényt hívunk meg (egy felhasználó által definiált függvényt) ami 10 másodpercenként újratölti az oldalt.

A setInterval() használata

<script>
window.setInterval('refresh()', 10000); // A FÜGGVÉNY HÍVÁSA MINDEN 10000 EZREDMÁSODPERCBEN AZAZ 10 MÁSODPERCBEN.
// AZ OLDAL FRISSÍTÉSE, ÚJRATÖLTÉSE
function refresh() {
window.location.reload();
}
</script>

Visszaszámláló készítése az oldal frissítéséhez

Készítsünk egy visszaszámlálót a setInterval() metódus használatával, amely mutatja a hátralévő másodperceket az oldal automatikusan újratöltődéséig.

A példa kód minden másodpercben frissíti a <span> elemet amely megjeleníti a hátralevő másodperceket.

A HTML kód

<!DOCTYPE html>

<html>

<body>

<h2>Az oldal újra töltődik <span id="display_counter" style="color:blue;">10</span> másodperc múlva</h2>

</body>

</html>

A Javascript kód

<script>
var counter = 10;// VISSZASZÁMLÁLÓvar count_down = window.setInterval(function () {
counter--;
if (counter >= 0) {
var span;
span = document.getElementById("display_counter");
span.innerHTML = counter;
}
if (counter === 0) {
clearInterval(counter);
}
}, 1000);
var page_refress = window.setInterval('refresh()', 10000);
// AZ OLDAL FRISSÍTÉSE, ÚJRATÖLTÉSE
function refresh() {
window.location.reload();
}
</script>

A clearInterval() használata

A HTML kód

Illeszd be a fentebbi HTML-kódba a következő sort a <div> tag alá:

<button onclick="stopFunction()">Stop timer</button>

A Javascript kód

Illeszd be a fentebbi HTML-kódba a következő sort a <script> tagok közé:

function stopFunction() {
console.log("button pressed");
clearInterval(count_down);
clearInterval(page_refress);
}

Végezetül

A JavaScript setInterval() különböző célokra használható. Fentebb csak két egyszerű példát mutattam be arra vonatkozóan, hogyan lehet automatikusan és többször végrehajtani.

Ne feledd, a setInterval() mindaddig futni fog amíg meg nem hívod a clearInterval() függvényt!

És itt a teljes forrás kód …

<!DOCTYPE html>
<html>
<body>
<h2>Az oldal újra töltődik <span id="display_counter" style="color:blue;">10</span> másodperc
múlva</h2>
<button onclick="stopFunction()">Stop timer</button>
<script>
var counter = 10;
// VISSZASZÁMLÁLÓ
var count_down = window.setInterval(function () {
counter--;
if (counter >= 0) {
var span;
span = document.getElementById("display_counter");
span.innerHTML = counter;
}
if (counter === 0) {
clearInterval(counter);
}
}, 1000);
var page_refress = window.setInterval('refresh()', 10000);
// AZ OLDAL FRISSÍTÉSE, ÚJRATÖLTÉSE
function refresh() {
window.location.reload()
;}
function stopFunction() {
clearInterval(count_down);
clearInterval(page_refress);
}
</script>
</body>
</html>

Happy coding!

Szólj hozzá!

Részletes elemzés a weboldaladról - Itt a Microsoft Sonar

Facebook Tweet Tetszik

0

2017. november 20. - GeorgeL

Weboldal elemző - Microsoft Sonar

A Microsoft egy új webfejlesztői, webprogramozói segédeszközt tett elérhetővé. A Sonar alapos elemzésnek veti alá a weboldalakat, és az azokban azonosított esetleges problémák alapján javaslatokat tesz arra, hogy miként is lehetne gyorsabbá, szabványosabbá és biztonságosabbá tenni őket.

Az új elemző eszköz nem statikusan elemzi az oldalakat, hanem ténylegesen be is tölti és végre is hajtja azokat, ami miatt sokkal hatékonyabban tudja azonosítani bennük a különböző problémákat.

Külön jó hír, hogy egy bővítmény segítségével a Sonar a Visual Studio Code-ba is integrálható. Itt tudod Sonar-t webfelületen elérni. Mindenképen érdemes kipróbálni!

Happy coding!

GeorgeL - Kód Akadémia

Szólj hozzá!

Hogy készíts sitemap.xml-t a Wordpress weboldaladhoz - Webhelytékép egyszerűen

Facebook Tweet Tetszik

0

2017. november 17. - GeorgeL

A jól megtervezett és kivitelezett SEO (Search Engine Optimization) stratégiák megvalósítása az egyik legfontosabb minden weboldal működéséhez. Ennek a stratégiának szerves részét képezi az weboldal oldalainak indexelése. Az indexelés során a weboldal tartalma láthatóvá és kereshetővé válik a különböző kereső motorokban, Google, Bing, Yahoo, stb.

A weboldal indexelésének lehetővé tételét, megkönnyítését a sitemap.xml file segíti.

Mi az a sitemap.xml?

A sitemap az weboldal felépítésének, struktúrájának leírása. Gyakorlatilag, mint a neve is mutatja egy térképet jelent a weboldal szerkezetéről ami a keresőrobotok számára előnyös, ez alapján ugyanis könnyedén összeállíthatják az indexelendő oldalak listáját.

A sitemap használata nem jelent garanciát a jelzett oldalak indexelésére. Előnye abban rejlik, hogy megkönnyíti a botok és spiderek munkáját és hatékonyabbá teszi a weboldal indexelést.

Hogy generálj sitemap.xml-t

A sitemap.xml-t manuálisan is lehetséges létrehozni, csak egy kis XML ismeretre van szüksége hozzá. Azonban ez elég időigényes folyamat abban az esetben ha a website-nak sok sok oldala van. Ehelyett sokkal egyszerűbb az online generátorok, letölthető szoftverek vagy WordPress bővítmények használata a sitemap.xml (webhelytérkép) elkészítéséhez.

Online sitemap generátorok

Az xml-sitemaps.com egy ingyenes szolgáltatás ahol a következőkre van lehetőséged:

XML webhelytérkép generálása (sitemap.xml), amelyet regisztrálni tudsz a különböző keresőmotorokba, mint például a Yahoo, a Google és a Bing;
Szöveges, txt formátumú, webhelytérképet, amely tartalmazza a website oldalainak URL-címeit;
HTML webhelytérképet, amelyet beilleszthetsz az oldalad forrás kódjába és segítségével látogatóid megtekinthetik a weboldalad teljes struktúráját

A xmlsitemapgenerator.org szintén egy ingyenes online sitemap generátor amely lehetőséget ad többek között a következőkre:

RSS, HTML and Google XML sitemaps generálás
Webhelytérképet generálása 2000 weboldalig
A keresőmotorok informálása az oldalak módosításáról és frissítéséről

Wordpress plugin segítségével

Az alábbiak a legjobb pluginok, amelyek sitemap.xml (webhelytérképek) létrehozására használhatók WordPress-hez:

A Google XML Sitemap Generator az egyik legjobb az elérhető pluginok közül. Ingyenesen letölthető és használható. Lehetővé teszi a Google XML, HTML és RSS sitemaps létrehozását. Listázza az összes hozzászólást, címkéket, kategóriákat, oldalakat, archívumokat és szerzőket valamint támogatja az egyéni bejegyzéseket és a taxonómiát. Belehet állítani, hogy automatikusan értesítse a keresőmotorokat a változtatásokról, frissítésekről. Ezt a generátort fogjuk használni a példánkban
További népszerű és könnyen használható sitemap generátor pluginek a Yoast SEO, SEO XML Sitemap, Simple WP Sitemaps

Lássuk mi a teendő a Google XML Sitemap Generator bővítmény használatához.

Telepítés

Jelentkezz be a weboldalad adminisztrációs felületére. A baloldali menüben keresd meg a Plugins -> Add new illetve ha magyar nyelvű akkor Bővítmények -> Új hozzáadása.

A keresőbe írd be Google XML Sitemap Generator és kattints az Install majd a sikeres telepítés után az Activate gombra.

Beállítás

Kattints a WordPress irányítópultján (adminisztrációs felületén) található Plugins - Bővítmények gombra, majd keresd meg az előbb telepített bővítményt (Google XML Sitemap Generator) és kattints a Settings - Beállítások-ra.

A General settings alatt állítható be

A weboldalon történt változások, frissítések automatikus küldése a keresőmotoroknak
A legfrissebb oldalak, bejegyzések automatikus hozzáadása a RSS hírcsatornához
A sitemap linkjeinek a robot.txt-be való beillesztése
Statisztikai adatok továbbítása a fejlesztőknek
És egy kis szívesség a plugin alkotóinak (egy apró bejegyzést illeszt a footer-be).

Nyugodtan hagyhatsz minden opciót bekapcsolva. Ha bekapcsolva hagyod az utolsó két opciót, természetesen egyáltalán nem változtatja meg sem a web oldalad kinézetét sem a működését! Ám amennyiben mégsem szeretnél statisztikai adatokat küldeni vagy megengedni, hogy a forráskódodba írjanak nyugodtan kapcsold ki az utolsó két opciót. Nem foglya befolyásolni a plugin működését.

A Sitemap default panel beállítási lehetőségei

Exclude - A sitemap tartalmazza e az adott oldalakat, bejegyzéseket Exclude - Include
Relative priority - fontossági sorrend beállítása
Update frequency - milyen gyakorisággal frissítse a sitemap-ot automatikusan

A képernyő jobb oldalán található Sitemap Related URLs panelen láthatod és ellenőrizheted a létrehozott fájlokat. Úgy mint, XML Sitemap, RSS Sitemap, New Pages, RSS Robots.txt. Ne felejtsd elmenteni a változtatásokat az oldal alján a Save changes gombbal, miután elkészültél a beállításokkal.

Összegzés

A sitemap (webhelytérkép) generálásának előnyei vitathatatlanok. Az automatizálás pedig jelentősen leegyszerűsíti a folyamatot. Az egyik legfontosabb előny az, hogy segítünk a keresőmotoroknak könnyen indexelni az oldalakat, ami magasabb rangsorolásához vezet vagyis a weboldalad előrébb kerül a keresők találati listáján.

Happy coding!

GeorgeL - Kód Akadémia

Szólj hozzá!

Wordpress Web programozás Web fejlesztés weblap térkép sitemap xml

Google Analytics-t hozzáadása Wordpress-hez

Facebook Tweet Tetszik

0

2017. november 17. - GeorgeL

Ha mérni szeretnéd web oldalad forgalmát, akkor nehezen találsz jobb megoldást mint a Google Analytics. Rengeteg információt szolgáltat a látogatóidról és arról, hogy mit csinálnak, miként viselkednek a weboldaladon.

Ebben a bejegyzésben megmutatom, miért kell a Google Analytics szolgáltatást használni (nem csak) a WordPress weboldaladon, és megmutatom, hogyan lehet hozzáadni az oldal forráskódjához. Remélhetőleg mire a bejegyzés végére érsz, már neked is sikerült beillesztened a Google Analytics-t az oldalad kódjába.

Miért használd a Google Analytics-t?

Weboldal tulajdonosként valószínűleg sokat törted a fejed azon, hogy a várva várt látogató hogyan találja meg a te weboldalad, mit csinál az oldaladon, miután rád talált, és hogyan segítheted őt abban, hogy a lehető legtöbb időt töltse el ott. Ezekre a kérdésekre a Google Analytics megadja neked a választ!

A Google Analytics egy hatékony elemzési eszköz, amely segít megérteni, hogy teljesít és milyen hatékony a web oldalad. Információkat nyújt, amelyek potenciálisan segítenek neked maximalizálni az online marketing erőfeszítéseit és növelni a konverziós arányokat. Ha még mindig nem vagy meggyőződve, itt van még néhány kényszerítő ok a Google Analytics használatának megkezdéséhez:

Hozz megalapozott döntéseket

A Google Analytics segítségével nyomon követheted a forgalmi és a felhasználói viselkedési adatok minden formáját, amelyek segítségével optimalizálhatod web oldalad kialakítását, tartalmát és funkcióit.

Készíts testreszabható jelentéseket

A Google Analytics 5 különböző jelentéstípussal rendelkezik, közvetlenül a dobozból. Ezenkívül beállíthatod saját egyéni jelentéseid a drag and drop felület használatával.

Valós idejű adatok

A Google Analytics valós idejű jelentései lehetővé teszik, hogy valós időben lásd a látogatókat a weboldaladon. Nem lenne fantasztikus látni, hogy hány látogató aktív a weboldaladon?

Most, hogy tisztában vagy azzal, hogy mi a Google Analytics, és miért érdemes ezt a webes szolgáltatást használni, nézzük meg, hogyan telepítheted azt a WordPress weboldaladra.

A Google Analytics telepítése Wordpress alá

Ebben a részben megtanulod a Google Analytics-t hozzáadni a weboldaladhoz és elkezdheted nyomon követni az oldalad forgalmát.

1. Lépés: Google Analytics fiók készítése

Először is szükséged lesz egy Google Analytics-fiókra. Ha már rendelkezel bármilyen Google-fiókkal, amelyet más Google-szolgáltatásokhoz (például a Gmailhez vagy a YouTube-hoz) használsz, akkor használhatod azt a Google Analytics fiók létrehozásához Amennyiben nem rendelkezel még semmilyen Google fiókkal, úgy előbb készítened kell egyet , mielőtt tovább lépsz.

Nyisd meg kedvenc böngésződet és menj a Google Analytics kezdőlapjára, majd kattints a Bejelentkezés> Analytics elemre

Miután bejelentkeztél a Google-fiókoddal, feliratkozhatsz a Google Analytics szolgáltatásra kattintva a Sign up/Regisztráció gombra kattintva.

Ezután megkel adnod az új fiókkal kapcsolatos adatokat. Vegyük át a szükséges beviteli mezőket egyenként.

Először is legfelül ki kell választanod, hogy mit szeretnél nyomon követeni. A mi esetünkben természetesen a Website-t kell választani mivel a weboldalunk alá szeretnénk a Google Analytics-t telepíteni.

Add meg a fiók nevét. Ide beírhatod a weboldalad nevét is az egyszerűség kedvéért.
Add meg a weboldalad nevét és webcímét (URL) pl.: ateoldalad.hu
Válaszd ki az oldalad kategóriáját és állítsd be az időzónát.
Hagy minden opciót kipipálva és kattints a Get Tracking ID gombra

Megjelenik egy felugró ablak a képernyőn, amely felkér, hogy fogad el a Google Analytics Általános Szerződési Feltételeit. A folytatáshoz kattints az Accept/Elfogadom gombra.

Ezután létrejön a Google Analytics-fiókod. Mindössze annyit kell tenned, hogy összekapcsolod a WordPress weboldaladdal, és elkezdheted nyomon követni a forgalmi mutatóit. Ehhez szüksége lesz a követési azonosítódra és webhely követési kódjára.

A következő képernyőn keresd meg a követési azonosítót és a JavaScript kódot a weboldal követése rész alatt. Be illesztheted egy szöveges fájlba vagy csak hagyd nyitva a böngésző ablakában. A lényeg, hogy könnyen hozzáférjél.

2. Lépés: A GA kód és az anozosító beillesztése a Wordpress kódba

Most, miután regisztráltál a Google Analytics szolgáltatásra, és megvan a követési azonosító és a szükséges Javascript kód, itt az ideje beilleszteni a weboldaladba.
A követőkódot a weboldal minden olyan lapjához hozzá kell adni, amelyet követni szeretnél.

A jó hír azonban az, hogy a WordPress szerkezetéből adódóan, egyszerűen hozzá tudod adni minden lap fejlécéhez a kódot, ugyanis elég a header.php file-t módosítanod ami ezután automatikusan alkalmazza a website összes oldalára.

Két módon teheted ezt - egy plugin használatával és manuálisan. A kézzel történő módosítás annyira egyszerű, hogy nem érdemes időt pazarolni a plugin-nal való beillesztésre. Ha mégis megpróbálkoznál itt egy plugin hozzá. (ha nem boldogultok vele, írjatok nyugodtan)

A Google Analytics hozzáadása manuálisan

Jelentkezzen be WordPress oldalad adminisztrációs felületére, és navigáljon a Megjelenés => Szerkesztő. Az oldal jobb oldalán rengeteg fájl fog megjelenni a Templates / Sablonok részben. Keresd meg Theme Header (header.php) fájlt, és nyisd meg a szerkesztőablakban.
Keresd meg a </ head> címkét, és illeszd be közvetlenül a Google Analytics követőkódját. Valahogy így fog kinézni:

A változtatások mentéséhez kattints a Fájl frissítése gombra.

Ennyi! Most már használhatod a Google Analytis-t

Most, hogy a WordPress web oldalad összekapcsoltad Google Analytics-fiókoddal, a forgalmi adatok megtekintéséhez csak nyisd meg böngésződben a Google Analytics admin felületét. Ha szeretnéd az adatokat a Wordpress admin felületén keresztül elérni próbáld ki ezt a plugin-t. A több mint 1 millió letöltés magáért beszél!

Fontos! A Google Analytics-nek legalább 24 órára van szüksége (attól a naptól kezdve, amikor hozzáadod a kódot a weboldaladhoz) az adatgyűjtésre. Javasolom, hogy néhány nap múlva ellenőrizd az elemzési jelentéseket.

Happy coding!

GeorgeL - Kód Akadémia

Szólj hozzá!

Google Analytics Wordpress Web programozás Web fejlesztés

A sütikről (cookies) dióhéjban

Facebook Tweet Tetszik

0

2017. november 17. - GeorgeL

Legtöbbünk már rutin szerűen kattint a felugró "Értem", "Rendben", "Elfogadom" gombokra. Sokszor anélkül, hogy tudnánk mire is adjuk az áldásunk. Nézzük meg, hogy a sütik esetében miről van szó!

Mik azok a sütik?

A sütik, vagy idegen megnevezéssel cookie-k, kis szöveges adatfájlok, amelyek a meglátogatott weboldal szervere és a böngészőnk közötti kommunikációt segítik.

suti

Amikor meglátogatsz egy weboldalt és elfogadod a sütiket a többekközött a következő információk tárolódhatnak el a számítógépeden:

mikor érkeztél
milyen nyelven beszélsz
mi a nick neved
milyen böngészőt használsz, stb.

Ha legközelebb visszatérsz tudni fogják, hogy már egy törzsvendégről van szó. A megfelelő neven és nyelven fognak megszólítani, az érdeklődésének megfelelő tartalmat ajánljanak majd neked.

Jobb felhasználói élmény és személyre szabott szolgáltatások = sütik

A sütik abban segítenek, hogy az oldalak böngészése kényelmes és gyors legyen a felhasználó számára. Emellett olyan funkciókat tesznek elérhetővé, amelyek által személyre szabott szolgáltatást kaphatunk az egyes weboldalakon. A sütik tehát növelik a felhasználói élményt.

sutik

Persze a sütik elfogadása nem kötelező. Ha nem fogadtad el, a weboldal ezeket az adatokat mindig meg fogja kérdezni a tőled. És elsőre nem biztos, hogy a megfelelő nyelven. És az sem biztos, hogy a neked ajánlott operett előadás igazán érdekelni fog.

A sütik elhelyezése nem jelent veszélyt a számítógépünkre vagy adatainkra, ugyanis:

Nem terjesztenek vírust, nem fertőzik meg a számítógépünket
Nem férnek hozzá a személyes adatainkhoz
Nem alkalmasak kémkedésre
Nem élnek vissza a gyűjtött adatokkal

web-security

Ugyanakkor a sütik tárolhatnak olyan adatokat, amik felhasználhatóak pl. reklám célra, így bizonyos szempontból alkalmasak lehetnek a látogató figyelmének vezetésére. Persze ez lehet hasznos is a jövőben, mert a személyre szabott reklámok azért kevésbé idegesítők, mint azok, amik téged biztosan nem érdekelnek.

Miért figyelmeztetnek minden alkalommal?

Egy új Európai uniós szabályozás szerint a sütiket alkalmazó weboldalak látogatójának joga van tudni, hogy az adott oldalak milyen fájlokat milyen célból helyeznek el a számítógépén. Ez alapján eldönthetjük, hogy engedélyezzük-e az adatfájlok elhelyezését, vagy sem. A legtöbb böngészőben kikapcsolhatjuk a sütik kezelését, ám ilyen esetben előfordulhat, hogy az oldal nem fog rendeltetésszerűen működni.

Happy coding!

GeorgeL - Kód Akadémia

Felhasznált források: Netbarat, Webonic

Szólj hozzá!

Webprogramozás mindenkinek

1. WORDPRESS

2. DRUPAL

3. JOOMLA

Összegezve

1. Wordpress logó eltávolítása

2. Egyedi logó beillesztése

Végszó

Mit jelent az SSL tanusítvány?

Az SSL tanusítvány előnyei

Biztos és titkosított kapcsolatot biztosít.

Védi a személyes adatokat az esetleges támadás ellen. Egy ilyen támadást akkor indíthatnak például, amikor az Ön weboldala hitelkártya-sorszámokat tartalmaz.

A setInterval() metódusának szintaxisa

A setInterval() használata

Visszaszámláló készítése az oldal frissítéséhez

A HTML kód

A Javascript kód

A clearInterval() használata

A HTML kód

A Javascript kód

Végezetül

Weboldal elemző - Microsoft Sonar

Mi az a sitemap.xml?

Hogy generálj sitemap.xml-t

Online sitemap generátorok

Wordpress plugin segítségével

Telepítés

Beállítás

Összegzés

Miért használd a Google Analytics-t?

Hozz megalapozott döntéseket

Készíts testreszabható jelentéseket

Valós idejű adatok

A Google Analytics telepítése Wordpress alá

1. Lépés: Google Analytics fiók készítése

Ezután megkel adnod az új fiókkal kapcsolatos adatokat. Vegyük át a szükséges beviteli mezőket egyenként.

2. Lépés: A GA kód és az anozosító beillesztése a Wordpress kódba

A Google Analytics hozzáadása manuálisan

Ennyi! Most már használhatod a Google Analytis-t

Fontos! A Google Analytics-nek legalább 24 órára van szüksége (attól a naptól kezdve, amikor hozzáadod a kódot a weboldaladhoz) az adatgyűjtésre. Javasolom, hogy néhány nap múlva ellenőrizd az elemzési jelentéseket.

Mik azok a sütik?

Jobb felhasználói élmény és személyre szabott szolgáltatások = sütik

A sütik elhelyezése nem jelent veszélyt a számítógépünkre vagy adatainkra, ugyanis:

Miért figyelmeztetnek minden alkalommal?