WordPress.com
A képek nagyszerű lehetőséget nyújtanak a WordPress.com webhelyed fejlesztésére. Ez az útmutató megmutatja a képek hozzáadásának különböző módjait.
Tartalomjegyzék
Képfájltípusok
A következő képtípusokat töltheted fel egy bejegyzéshez vagy oldalhoz:
- .jpg/.jpeg
- .gif
- .png
Tartalomjegyzék
Képes útmutatók
A képekkel sok mindent tehetsz, ezért több oldalra bontottuk őket:
- Képek feltöltése – Minden a képek bejegyzésekbe és oldalakba való beviteléről a számítógépedről, az internetről és a Médiatárból.
- Képbeállítások – Cím vagy felirat hozzáadása a képekhez. Itt találod meg a képeddel kapcsolatos alapvető információkat, például az állandó linket, a kép méreteit és a fájltípust.
- Képek szerkesztése – A képed fejjel lefelé áll vagy túl nagy? Ez egy útmutató a képek vágásához, elforgatásához és méretezéséhez.
- Galériák és diavetítések – Képeit galériában vagy diavetítésben jelenítheti meg.
- Képoptimalizálás – Ha a képek beszúrása előtt csökkenti a képek fájlméretét, a feltöltések és az oldalak gyorsabban betöltődnek.
- Hibaelhárítás – Nem töltődnek fel a képei? Íme néhány tipp, hogy működjenek!
- Ingyenes képek és más médiumok keresése – Szüksége van egy szabadon hozzáférhető vagy copyleft képre az oldalához? Íme néhány javaslat, hogy hol találhatod meg őket!
Tartalomjegyzék
Példák
Itt van néhány működő példa, amely megmutatja a képek különböző megjelenítési módjait a blokkok használatával. A képek másképp fognak kinézni attól függően, hogy milyen témát használsz az oldaladon, ezért próbáld ki őket az oldaladon!
A képek mind a Pexels ingyenes fotótárából származnak.
Image Block
A Image block a szingli képek hozzáadására szolgál. Minimalista, de a Columns blokkal kombinálva kreatív dizájnt eredményezhet, ahogy azt a Coutoire téma is mutatja.
Egyértelmezett stílus:

Kerekített stílus:

Cover Block
A Cover blokk a teljes szélességű megjelenítést lehetővé tevő témával értékelhető a legjobban. Csodálatosan mutatkozik be a Dalston, Alves és Maywood témákban.
A blokk tartalmazza a fix háttér, az átfedés gradienssel és a különböző megjelenítési stílusok beállításait.
Fixed Background ON

Fixed Background OFF
Gradiens Overlay alsó és felső hullám stílusokkal

.

Galéria blokk
A Galéria blokk lehetővé teszi több fénykép egyszerű hozzáadását és automatikus, vonzó módon történő elrendezését.
Diavetítés blokk
A diavetítés blokk kiválóan alkalmas képek megosztására anélkül, hogy túl sok helyet foglalna egy oldalon vagy bejegyzésben. Lásd a Rivington témában.
Az alábbi példa az automatikus lejátszás opciót használja, az összes többi lehetőségről a Slideshow blokk útmutatójában olvashatsz.
-
Fotó: Hendrik Cornelissen on Pexels.com -
Photo by Elena Blessing on Pexels.com -
Photo by on Pexels.com
Média & Szövegblokk
A Média & Szövegblokk lehetővé teszi, hogy képet vagy videót helyezzen el szöveggel egymás mellett.
Mobileszközökön praktikus lehetőséggel rendelkezik a média és a szöveg egymásra helyezésére.
A használatának néhány kreatív módja látható az Exford és Barnsbury témában.

“Ha van egy könyv, amit el akarsz olvasni, de még nem írták meg, akkor meg kell írnod.”
– Toni Morrison


A bal oldalon látható, hogyan jeleníti meg a mobilon lévő verem opció a tartalmat.
Alapértelmezés szerint a média jelenik meg felül.
Képösszehasonlító blokk
A Képösszehasonlító blokk segítségével két képet helyezhet egymás mellé (vagy fölé és alá), és egy csúszkával felfedheti a két kép közötti különbségeket.




Tiled Gallery Block
A Tiled Gallery blokk tartalmazza a lekerekített sarkok lehetőségét, és négy különböző stílusban érhető el:
- Cserépmozaik
- Kör alakú rács
- Négyzet alakú csempék
- Cserép oszlopok
Önmagában is kreatív módja a képek megosztásának, és remek társa lehet a Slideshow blokknak, ahogy a Rivington témában is látható.
Cserépmozaik





Körkép. rács





Négyzet alakú lapok, lehetőség a lekerekített sarkok





Cserép oszlopok
.





CoBlocks
CoBlocks a GoDaddy által kezelt blokkkönyvtár, amelyet a WordPressen keresztül bocsátunk az Ön rendelkezésére.com. Négyféle galériát tartalmaz:
- Collage
- Stacked
- Masonry
- Offset
És számos további opcióval rendelkezik:
- Képvilágítás engedélyezése
- Feliratok megjelenítése vagy elrejtése
- Egyedi képek összekapcsolása
- Vágásvezérlés a képek közötti távolság beállításához
- Képszűrők alkalmazása (szürkeárnyalat, szepia, telítettség, halvány, vintage)
A galériák teljes szélességben is megjeleníthetők az ezt lehetővé tevő témákban, amint azt a Mayland téma is mutatja.
Kollázs blokk
A Kollázs blokk a képeket egy gyönyörű kollázs galériává állítja össze.
Egyértelmezett megjelenítés
.
Cserépkijelzés szepia szűrővel
Layered display with shadow effect and grayscale filter
Kőműves blokk
A kőműves blokk több képet jelenít meg a rendelkezésre álló függőleges hely alapján optimális pozícióban, valahogy úgy, mintha egy kőműves illesztené a köveket a falba.
Offset Block
Az Offset blokk a képeket egy eltolt téglamintás galériában jeleníti meg.
Carousel Block
Nem tévesztendő össze a Post Carousel blockkal, a CoBlocks Carousel blokk lehetővé teszi, hogy csak képeket jelenítsen meg egy körhintán belül.
Itt egy animáció arról, hogyan jelenik meg:

A karusszel blokk csak a Business és eCommerce tervű oldalakon érhető el, ahol plugint telepítettek.
Stacked Block
A Stacked blokk több képet jelenít meg egy oszlopos, egymásra helyezett galériában.
Szaturációs szűrő
Vintage szűrő
- .
-
-
-
-
GIF blokk
A GIF blokk lehetővé teszi, hogy egyszerűen hozzáadj néhány GIF képet a Giphy-ből.
Ez egy színes módja annak, hogy kifejezd az érzéseidet az oldaladon.
Öröm
Szomorúság
Változatos tervezetek és árazás
-
Ingyenes
A diákoknak a legjobb
.
-
Személyes
A legjobb hobbistáknak
-
Premium
A legjobb szabadúszóknak
-
Üzleti
A legjobb kisvállalkozásoknak
Terv kiválasztása
.