Sziasztok Unatkozó Utazók!
Én, mint régi blogos szinte végigkövettem a HTML és CSS
térhódítását. Azonban sosem gondoltam volna, hogy egyszer majd esetleg csinálhatok
valami nagy projektet. De igen, és ez a projekt megkövetel tőlem néhány dolgot.
Valamint a saját blogom szépítgetését is szeretem a legprofibb módon megoldani.
De vannak olyan problémák, amiket sok utánanézés, értelmezés után tudtam csak
megfejteni. Hogy nektek ne kelljen ennyit kutatni, hoztam párat.
… távolítsd el a sütis (cookie) üzenetet?
Habár mostanában minden oldalon kint van ez a szöveg –
ugyanis EUs kötelezettség – azonban legtöbbször alul, vagy legalábbis nem
fél oldalt elfoglaló kivitelben. A google nem ezt alkalmazza így blogjaink
felső sávját gyakorlatilag nem is látjuk – csak akkor, ha rányomunk az Elfogad gombra.
Mivel engem is zavart – és egy olyan projekt van a kezeim
közt, aminél nagyon zavaró – így kutattam a neten. És jelentem, megtaláltam a
működő módszert. (Azonban én alul jelezni fogom, hogy milyen cookie-kat használ
az oldal!)
A következő kódot:
<script
type='text/javascript'> cookieChoices = {};</script>
pontosan a <head>
alá kell beszúrni és így megszűnik.
Ez egy JavaScript kód, amiben a cookieChoices az a bizonyos figyelmeztető üzenet, a ={} pedig az, hogy üres – azaz nem
jelenik meg. [Ha esetleg van rá igény azt is leírhatom, hogy hogyan lehet
formázni.]
… távolítsd el a letöltött sablon copyright-ját?
Letöltöttél egy sablont egy külföldi oldalról – mert neked
is megtetszett az új minimalista trend – és azt vetted észre, hogy alul nem a
„Powered by Blogger” felirat szerepel, hanem egy link az oldalra, ahonnan
letöltötted a sablont? Megpróbáltad eltávolítani és aztán kétségbeestél, hogy
az oldalad átirányítódott az eredeti oldalra? Szeretnéd máshol megjelölni a
készítőt, de nem tudsz mit tenni? Itt a megoldás!
Keress rá arra a részre, hogy copyright vagy All right
reserved és máris a megfelelő helyen vagy. A link után még vannak
információk, amik közé/után, de még a ></a>
előtt be kell illesztened ezt:
style='visibility:hidden'
Ez egy css kód, amiben a style
az a stílust jelöl, azaz, hogy az változtatjuk meg; a visibility a láthatóság megnevezése; a hidden pedig, hogy elrejtett.
… adj hozzá ikonokat?
Én mindig is imádtam azokat a kis ikonokat, amiket az
amerikai blogoknál láttam. Hiszen milyen menő már betenni egy szívet vagy
szmájlit betenni ide-oda? Persze, a Goggle-t nem kell félteni, a
bejegyzéseinkbe már van lehetőségünk emojikat beilleszteni – az oldalsávunk
azonban nem ilyen szerencsés.
Én a Font Awesome oldalán található ikonokat használom
végül, mert az oldalukon – ami ITT
érhető el – lehet szemezgetni, hogy mi is a választék. Ha te is szeretnél ikonokat
mindenhova, akkor itt van hogy.
Első lépésként a <head>
alá be kell tenni az alábbi linket (ha csak egy adott modulban akarod
használni elég magába a widgetbe beilleszteni):
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
Ez az egész nem más, mint a hivatkozás az ikon adatbázisra.
Ha ez megvan már el is érhetőek az ikonok.
<span class="fa fa-heart"></span>
<span class="fa fa-heart"></span>
Lia jelezte, hogy én balga a formázottakat osztottam meg (bocsi, én formáztam a saját példámban és azt használtam a többihez is), de talán szeretnétek tudni mi is a nem formázott. Ez pedig a span jelölés, amit átírhattok csak a span helyére írjátok be a betűkódot (b, i, u vagy éppen s). Én dőltté formázom a példáimon.
<i class="fa
fa-heart"</i>
A fenti kód eredménye, hogy megjelenik egy szív. A fa jelöli a Font Awesome-t – mindkét esetben
–, míg a heart maga a megnevezése az
ikonnak.
<i class="fa
fa-heart">szív</i>
Ez a kód pedig majdnem ugyanaz mint az előző, csak itt a
szív ikon mellé odaírtam, hogy szív.
<a
href="https://195.199.149.2/" target="_blank"><i
class="fa fa-maxcdn"></i>E-napló</a>
Ez pedig egy példa arra, hogy linket – ami új ablakban
nyílik meg a target=”_blank” miatt –
hogyan szúrjunk be, hogy az ikonra kattintva. Én mögé írtam, hogy ez például az
E-naplóra mutat, tehát szöveget is lehet írni mögé.
Nektek van olyan
problémátok, amire még nem jöttetek rá, hogy lehetne megoldani?
Miről szeretnétek még olvasni, miben segíthetek?
Miről szeretnétek még olvasni, miben segíthetek?
Istenítem az embereket akik értenek az ilyenekhez.:)
VálaszTörlésBekövettelek!:)
Köszi! :)
TörlésHa egyszer ráérez az ember, akkor már nincs megállás! :)
Szia! Köszi a segítséget. Te ezeket honnan tanulod? Lehetne még sok-sol ilyen. :)
VálaszTörlésSzia! :)
TörlésA HTML/CSS-t éveken keresztül autodidakta módon tanultam (van egy internetes oldal, ami segít az alapokban, majd arról is írok, mert angol és sokakat ez zavar), a JavaScript-et pedig a főiskolai jegyzetekből sajátítom el (majd csak a 4. félévben lesz "A webprogramozás alapjai" tárgyam).
Lesz még ilyen bejegyzés! :)
Szia! A FontAwesome ikonokkal kapcsolatban annyit fűznék hozzá, hogy ha a jelenleg leírt módon formázod, akkor ugyanúgy fogja megjeleníteni, mint a dőlt betűtípust, annak ellenére, hogy ez úgy működik, mint egy link. Ha az i helyett span-t használsz, akkor linkként fogja értelmezni a rendszer. Nyilván külön is lehet formázni az ikonokat. Mindkét módon szép, én az utóbbit részesítem előnyben, és gondoltam, megosztom veled ezt a tapasztalatomat. :)
VálaszTörlésSzia Lia! :)
TörlésKöszi, meg mondom őszintén erre nem is figyeltem - mármint, hogy így osztottam meg. A saját példámból vettem (az utolsó) ki a szükségtelen részeket és én formáztam, de totál elfelejtettem kivenni :D
Megyek és bepasszintok még egy sort :)
Köszi, hogy benéztél! :)