Divi bemutató: A Social Media modul használata

A Divi Social Media modulja lehetővé teszi linkek létrehozását olyan ikonok alapján, amelyek az online közösségi profilokra mutatnak, mint például a Facebook, a Twitter és a Google+. Ezek az ikonok integrálódnak a témába, Divi saját stílusában, stílusos ikonjaival, ami előnyösebbé teszi őket, mint a külső gyártóktól származó beépülő modulokat. Linkeket adhat hozzá több közösségi profilhoz minden modulban, és a modult hozzáadhatja az oldal bárhova.

Hogyan adhatunk hozzá egy szociális média modult az oldalhoz

Mielőtt közösségimédia-modult adna az oldalához, először be kell ugrania a Divi Builderbe. Egyszer a Divi téma telepítve van a webhelyére, észrevesz egy gombot Használja a Divi Buildert a bejegyzésszerkesztő felett, amikor új oldalt hoz létre. Kattintson erre a gombra a Divi Builder aktiválásához és az összes Divi Builder modul eléréséhez. Ezután kattintson a gombra Használja a Visual Builder alkalmazást hogy a generátort vizuális módban indítsa el. Kattintson a gombra is Használja a Visual Builder alkalmazást amikor az előtérben böngészi a webhelyet, ha csatlakozik a WordPress irányítópultjához.

Miután belépett a Visual Builder programba, a szürke plusz gombra kattintva új modult adhat hozzá az oldalához. Új modulok csak sorok belsejében adhatók hozzá. Ha új oldalt indít, ne felejtse el először hozzáadni egy sort az oldalához.

Keresse meg a közösségi média modult a modulok listájában, és kattintson rá, hogy hozzáadja az oldalához. A modok listája kereshető, ami azt jelenti, hogy beírhatja a „Kövess minket a közösségi médiában” szót is, majd az „Enter” gombra kattintva megtalálja és automatikusan hozzáadja a közösségi média modját! A modul hozzáadása után a modul opcióinak listája fogadja. Ezek az opciók három fő csoportra vannak felosztva: Tartalom , Fogamzás et fejlett .

Példa felhasználási esetre: Megfelelő közösségi média ikonok hozzáadása egy kapcsolattartó oldalhoz

Egy webhely kapcsolatfelvételi oldala a tökéletes hely online közösségi profiljainak bemutatására. Ez több lehetőséget biztosít a felhasználók számára, hogy kapcsolatban maradjanak és elősegítése a blogod vagy a vállalkozásod. Ebben a példában megmutatom, hogyan adhat hozzá közösségimédia-ikonokat, hogy azok illeszkedjenek a kapcsolati oldal jelenlegi kialakításához.

A vizuális készítő használatával adjon hozzá egy új rendes szakaszt, amelynek az oszlopának teljes szélessége egy sor. Helyezzen be egy közösségi média modult az oszlopába.

A modul beállításainak Tartalom lapján kattintson az "Új elem hozzáadása" gombra, hogy új közösségi hálózatot adjon a modulhoz. Az adott közösségi hálózati beállítások alatt frissítse a következőket:

Tartalom opciók

Közösségi hálózat:
Facebook-fiók URL-je: [adja meg Facebook-fiókjának URL-jét]

Tervezési lehetőségek

Ikon színe: # d94b6a (válogatott szín)

Ezután másolja le ezt a közösségi hálózatot további négy hálózat (Twitter, Google+, LinkedIn és Instagram) hozzáadásához. Amióta lemásolta a hálózatot, az egyéni ikon színe átkerült. Tehát csak frissítenie kell az egyes hálózati URL-eket és fiókokat.

Most már vannak olyan szociális média ikonjai, amelyek megegyeznek a névjegy oldal kialakításával.

Közösségi média tartalmi lehetőségek

A Tartalom fülön megtalálja a modul összes tartalmi elemét, például szöveget, képeket és ikonokat. Minden, ami irányít mi jelenik meg a modulban, mindig megtalálható ezen a lapon.

Új objektum hozzáadása

Itt adhat hozzá új hálózatokat a moduljához. Az "új elem hozzáadása" gombra kattintva egy teljesen új ablak nyílik meg az új hálózathoz tartozó opciókról (a "Tartalom", "Tervezés" és "Haladó" fülek alatt). Az alábbiakban lásd az egyes közösségi média hálózati beállításokat.

Az első hálózat hozzáadása után egy szürke sáv jelenik meg, amelyen a hálózati cím címkeként jelenik meg. A szürke sávban három gomb is található, amelyek lehetővé teszik a hálózat szerkesztését, másolását vagy törlését.

Link űrlap

Itt kiválaszthatja a közösségi hálózati ikonok lekerekített téglalap vagy kör alakját.

Az URL megnyílik

Válassza ki, hogy a hálózati URL-t új lapon vagy ugyanabban az ablakban nyitja meg.

Kövesse a gombot

Itt kiválaszthatja, hogy az ikon mellett szerepeljen-e a következő gomb.

Admin címke

Ez megváltoztatja a konstruktor modul címkéjét az egyszerű azonosítás érdekében. Amikor a WireFrame nézetet használja a Visual Builder alkalmazásban, ezek a címkék a Divi Builder felület modulblokkjában jelennek meg.

Közösségi média tervezési lehetőségek

A Tervezés fülön megtalálja a modul összes stíluslehetőségét, például a betűtípusokat, a színeket, a méretezést és a térközt. Ezen a lapon módosíthatja a modul megjelenését. Minden Divi modulnak hosszú a tervezési beállítások listája, amelyek segítségével megváltoztathatja a megjelenést.

Ennél a modulnál a tervezési lehetőségek egyetlen elemből állnak - Szövegszín.

Szöveg színe

Itt kiválaszthatja, hogy szövege világos vagy sötét legyen. Ha sötét háttér előtt dolgozik, akkor a szövege világos legyen. Ha a háttere világos, akkor a szövegének sötétnek kell lennie.

Speciális közösségi média lehetőségek

A Haladó lapon olyan lehetőségeket talál, amelyeket a tapasztaltabb webtervezők hasznosnak találhatnak, például egyéni CSS és HTML attribútumokat. Itt alkalmazhat egyedi CSS-t a modul számos elemére. Alkalmazhat egyedi CSS osztályokat és azonosítókat is a modulra, amelyek felhasználásával testreszabhatja a modult a gyermek téma style.css fájljában.

CSS azonosító

Adjon meg egy opcionális CSS azonosítót, amelyet ehhez a modulhoz használ. Az azonosító felhasználható egyedi CSS-stílus létrehozására vagy az oldal egyes szakaszaira történő hivatkozásokra.

CSS osztály

Adja meg az ehhez a modulhoz használandó opcionális CSS osztályokat. Egy CSS osztály felhasználható egyedi CSS stílus készítéséhez. Több osztályt is felvehet, szóközzel elválasztva. Ezeket az osztályokat fel lehet használni a Divi gyermek témában vagy az egyéni CSS stíluslapban, amelyet hozzáad az oldalához vagy webhelyéhez a téma opciók Divi vagy a Divi Builder oldal paraméterei.

Egyéni CSS

Az egyedi CSS alkalmazható a modulra és a modul bármely belső elemére is. Az Egyéni CSS részben talál egy szövegmezőt, ahol egyedi CSS stíluslapokat adhat hozzá minden elemhez. Az ezekben a beállításokban található CSS bejegyzések már stíluscímkékbe vannak csomagolva. Tehát csak pontosvesszővel elválasztva adja meg a CSS-szabályokat.

láthatóság

Ez az opció lehetővé teszi azoknak az eszközöknek a vezérlését, amelyeken a modul megjelenik. Választhatja a modul deaktiválását táblagépeken, okostelefonokon vagy asztali számítógépeken egyenként. Ez akkor hasznos, ha különböző modokat szeretne használni különböző eszközökön, vagy ha le akarja egyszerűsíteni a mobil tervezését bizonyos elemek eltávolításával az oldalról.

Egyéni közösségi médiatartalmi lehetőségek

Közösségi Hálózat

Itt kiválaszthatja a megjeleníteni kívánt közösségi hálózatot.

Fiók URL-je

Itt adja meg ennek a közösségi hálózati linknek az URL-jét. Ha a Facebookot választotta hálózatának, akkor ide tenné a Facebook oldalának URL-jét.

Egyéni közösségi médiatervezési lehetőségek

Ikon színe

A Divi alapértelmezett színeket kínál minden közösségi hálózathoz. Itt könnyen megváltoztathatja ezt az ikon színét a kívántra.

Speciális közösségi média lehetőségek

Egyéni CSS

[vc_row center_row = "igen"] [vc_column width = "1/2 ″] [vcex_button target =" blank "layout =" kibontva "align =" center "font_family =" Raleway "font_weight =" 700 ″ style = "flat" custom_background = "# 18b69d" custom_hover_background = "# 118d7a" custom_color = "#ffffff" custom_hover_color = "#ffffff" icon_right = "fa fa-download"] A DIVI TÉMA LETÖLTÉSE [/ vcex_button] [/ width [»v_c_column] » 1/2 ″] [vcex_button url = "https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials" target = "üres" layout = "kibontva" igazítás = "középre" font_family = "Raleway" font_weight = "700 ″ style =" flat "custom_background =" # c4226e "custom_hover_background =" # 8d184f "custom_color =" #ffffff "custom_hover_color =" #ffffff "icon_right =" TE fa-downLOAD "] DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

Divi bemutató: A Social Media modul használata

Hogyan adhatunk hozzá egy szociális média modult az oldalhoz