paghahanap
Isara ang box para sa paghahanap na ito.

Tutorial sa WordPress Elementor | Isang Step By Step Guide Sa 2024

Pagbubunyag ng kaakibat: Sa ganap na transparency – ang ilan sa mga link sa aming website ay mga affiliate na link, kung gagamitin mo ang mga ito para bumili, kikita kami ng komisyon nang walang karagdagang gastos para sa iyo (wala kahit ano pa man!).

Gusto mong magsimula sa Elementor at naghahanap ng a Tutorial sa WordPress Elementor? Dito nagtatapos ang iyong paghahanap. Sa artikulong ito, sasabihin ko sa iyo ang tungkol sa lahat ng mga bagay na kailangan mong malaman tungkol sa Elementor.

Mula mismo sa pag-install nito hanggang sa paglikha ng isang napaka-istilong pahina, lahat ng iyong mga pagdududa ay malulutas kung babasahin mo ang artikulo. Tinitiyak ko sa iyo; hindi mawawalan ng kabuluhan ang pagbabasa!

Ngunit kailangan mo ng plugin ng tagabuo ng website upang magbigay ng propesyonal na ugnayan sa iyong website.

Paano mo ito makukuha? Well, ginagamit ko Elementor para doon. Pinapadali ng Elementor para sa akin na gumawa ng isang propesyonal na website sa pamamagitan ng simpleng tampok na pag-drag at pag-drop. 

Gustong malaman ang higit pa tungkol sa Elementor, pagkatapos ay tingnan ang aking detalyado Suriin ng Elementor.

Nasa akin ang lahat ng tanong na ito para sa iyo sa blog:

Paano ko mababago ang kulay ng background ng isang elemento?

Ano ang layout at paano ko ito gagamitin?

Ano ang isang widget at paano ko ito idadagdag?

Ano ang ilang iba pang mga tool na inaalok ng Elementor?

Paano ako makakagawa ng custom na widget?

BOTTOM LINE UPFRONT:-

Ang Elementor, ang platform ng tagabuo ng website ay nagbibigay ng perpektong disenyo, na may iba't ibang mga tema, mga add-on, mga form na biswal na idinisenyo, isinasaalang-alang ang bawat piraso ng iyong mga pangitain sa pagdidisenyo. Mayroon itong maraming mga posibilidad sa disenyo, na may kapangyarihang i-customize ang bawat bahagi ng website tulad ng header, mga post, at marami pang iba.

Binibigyan ka nila ng walang gastos na mga demonstrasyon, video, at code para makopya at i-paste mo lang ito, at makita ang epekto sa iyong web-page. Nagbibigay ang mga ito ng mga estilo at epekto na kailangan sa mga web page gamit ang CSS.

Subukan ang Elementor ngayon.

Paano Mag-install ng Elementor Sa WordPress

Well, mayroong 2 paraan kung saan maaari mong mai-install ang Elementor Sa WordPress. 

  • Sa pamamagitan ng opisyal na website ng Elementor

Tumungo sa opisyal na website ng Elementor at mag-click sa pindutan ng Libreng Download na ipinapakita sa website. 

Tutorial sa WordPress Elementor

Sa sandaling mag-click ka sa pindutan ng Libreng Download, lalabas ang isang pop-up upang mag-subscribe sa website ng Elementor, at sa sandaling gawin mo iyon, awtomatikong magsisimulang mag-download ang Plugin.

Simulan ang Pag-download ng Elementor

Makakakita ka ng zip file na na-download sa iyong laptop/Pc. Pumunta ngayon sa iyong WordPress dashboard at mag-click sa seksyong Mga Plugin > Magdagdag ng Bagong Plugin > Mag-upload ng Plugin

Mag-upload ng Elementor Plugin

Piliin ang Elementor file at i-upload ito sa WordPress.

Piliin ang Elementor Plugin

  • Sa pamamagitan ng WordPress dashboard

Maaari mo ring i-install ang Elementor plugin nang direkta mula sa dashboard ng WordPress. Pumunta lamang sa Plugin at pagkatapos ay Magdagdag ng Bagong Plugin

Sa kanang sulok sa itaas, makikita mo ang isang search bar, i-type ang Elementor sa search bar. Ang pinakaunang resulta ay kung ano ang kailangan mong i-install sa iyong WordPress. I-click lang ang install at hintayin na mai-install ang Plugin. I-activate ang Plugin, at mayroon kang mahusay na tagabuo ng website na handa para sa pag-deploy.

I-install at i-activate ang Elementor

Ngayong na-install mo na ang Elementor sa iyong WordPress dashboard, tingnan natin ang mga feature na ibinibigay nito.

Mga Feature ng Elementor At Ang Paggamit Nito Sa Pagbuo ng Webpage

Ang listahan ng mga feature na ibinibigay ng Elementor ay walang katapusan, kaya tatalakayin ko ang maraming mahahalagang feature ng Elementor. Siguraduhing basahin mo ang mga ito at subukan ang mga ito sa ibang pagkakataon.

Mayroong dalawang mga plano para sa Elementor The Free at The Pro. Tulad ng iminumungkahi ng pangalan para sa Pro plan, kakailanganin mong maglaro, ngunit mayroong ilang mga tampok na kasama ng libreng plano nito.

Sisimulan ko muna sa pamamagitan ng pagtalakay sa mga feature sa Libreng plan, kasunod ang Pro.

Mga Tampok ng Elementor na Libreng Plano

Mahalagang Tampok:

  • I-drag at i-drop

Ang tampok na pag-drag at pag-drop ng Elementor ay napakabilis at tumutulong sa iyong gawing mas mabilis ang disenyo ng mga web page. Mula sa paggawa ng layout ng web page hanggang sa pag-fine-tune, magagawa ang lahat sa pamamagitan lamang ng pag-drag at pag-drop.

Hindi mo kailangang lumipat ng mga tab o baguhin ang pahina upang idisenyo ang iyong mga header at footer. Sa Elementor, magagawa mo ito sa parehong page kung nasaan ang iyong pangunahing web page.

Maaari mong kopyahin at i-paste, kahit na i-duplicate ang estilo o ang tampok na gusto mong gamitin. Makakatipid ito ng iyong oras upang muling buuin ang parehong tampok nang paulit-ulit.

Gamit ang opsyon sa search bar na ibinigay ng Elementor, madali kang makakapag-navigate sa website at maabot ang gustong tab sa loob ng ilang segundo. Ang tampok na ito ay talagang kapaki-pakinabang kapag mayroon kang isang napakahabang pahina upang bumuo.

May 3 opsyon para i-save ang iyong disenyo, mula sa pagtanggal at pagkuha ng backup. Maaari mong gawing muli/i-undo ang mga disenyong ginawa mo. Nagbibigay ito sa iyo ng kakayahang mag-uri-uriin ng pagsubok ng A/B sa pahina gamit ang iyong mga obserbasyon. 

Maaari mong bisitahin ang lahat ng mga rebisyon sa tab ng rebisyon, ibig sabihin, Maaari mong tingnan ang lahat ng mga uri ng mga disenyo na nasubukan mo na sa iyong webpage at pumili din ng mas naunang bersyon kung hindi mo gusto ang iyong kasalukuyang webpage. 

Gustong subukan ang maraming iba't ibang mga tampok at tingnan kung ano ang gumagana? Walang problema sa Elementor; maaari mong idisenyo ang pahina sa draft mode, subukan ang lahat, at kunin ang pahina sa ibang pagkakataon pagkatapos mong ganap na handa na i-publish ang pahina.

Paano gamitin ang tampok na Elementor Drag and Drop

Ang lahat ng mga tampok na drag at drop ay magagamit sa kaliwang bahagi ng pahina sa sandaling lumikha ka ng isang pahina.

Pagkatapos gumawa ng page sa WordPress at bigyan ito ng pamagat, i-click lang ang edit gamit ang Elementor, na magdadala sa iyo sa live na editor ng Elementor, na kamukha ng larawan sa ibaba.

Paggamit ng Drag and Drop Feature

Sa pangalawang larawan sa itaas, maaari mong tingnan ang mga opsyon sa pag-drag at pag-drop sa kaliwang bahagi ng page. Maraming widget ang kailangan mo lang i-scroll pababa, o maaari ka ring maghanap ng widget sa tulong ng search bar sa itaas.

  • Mga Disenyo ng Mga Template

Makakakuha ka ng mga inbuilt na template ng disenyo gamit ang Elementor. Hindi lang 5 o 10, ngunit binibigyan ka ng Elementor ng 100+ template ng disenyo na malayang gamitin at higit pa kapag nag-upgrade ka sa Pro na bersyon.

Paano piliin ang gustong template para sa library ng template ng Elementor

Kapag una mong nakita ang pagbukas ng pahina ng tagabuo ng Elementor, makikita mo ang isang bagay sa uri na ipinapakita sa ibaba:

Ang larawan ay kinuha mula sa website ng Elementor at medyo maliwanag.

Elementor Template Library

Sa sandaling mag-click ka sa opsyon ng Folder, makikita mo ang isang pop-up na ipinapakita sa ibaba.

Pumili ng Template Mula sa Library

  • widgets

Ang mga drag at drop na widget na kasama ng Elementor ay hindi mabilang. Ang ilan sa kanila ay:

  • Inner Section: Hatiin natin ang isang seksyon sa dalawa.
  • Heading: I-drop ang field na ito sa iyong webpage upang mag-plug sa isang nakakaakit na heading
  • Larawan: Maglagay ng mga larawan sa iyong webpage sa tulong ng widget na ito
  • Text Editor: Mag-input ng text sa iyong webpage sa tulong ng widget ng text editor
  • Video: Maaari kang gumamit ng widget ng Video upang maglagay ng mga de-kalidad na video sa iyong pahina. Papataasin nito ang karanasan ng gumagamit
  • Button: Napakahalaga ng call to action para sa halos lahat ng site, na may mga button na maaari mong ilagay ang call to action sa iyong page at i-link ang mga ito sa iyong landing page ng produkto.
  • Star Rating: Ang star rating ay kapaki-pakinabang para sa anumang website ng eCommerce upang magbigay ng rating sa ilang iba't ibang mga produkto na inaalok nito.
  • Divider: Tumutulong sa iyong web page sa indentation at bumubuo ng puting espasyo upang madagdagan ang karanasan ng user.
  • Mga Icon: Gamit ang icon na widget, maaari kang maglagay ng mga nakakaakit na icon ng social media pati na rin ang iba't ibang serbisyo upang gawing mas kaakit-akit ang iyong pahina.
  • Counter: Gumawa ng countdown timer para sa iyong mga produkto o limitado ang mga karagdagang serbisyo upang makalikha ng pagkaapurahan.
  • Mga Testimonial: Magdagdag ng mga testimonial tungkol sa iyong mga produkto at serbisyo upang bumuo ng tiwala sa iyong mga bisita sa website.

Bukod dito, marami pang ibang widget tulad ng image carousel, basic gallery, tab, shortcode, HTML, menu bar, atbp. Siguraduhing tingnan mo ang lahat ng feature pagkatapos i-install ang plugin sa WordPress.

Tingnan ang ilan sa mga widget na mayroon si Elementor sa ibaba sa larawan.

Paano gamitin ang Elementor Widgets

Para sa paggamit ng Elementor Widgets:

Tumungo sa dashboard ng Elementor at tumingin sa kaliwang bahagi ng page. Mayroong ilang mga widget na maaari mong i-drag at i-drop sa iyong webpage at simulan ang iyong trabaho.

Paano Gamitin ang Mga Elementor Widget

  • Tumutugon sa pagdidisenyo at pag-edit

Dahil ang mobile-first index rule ay napupunta sa limelight, tinitiyak ng Google na mas mataas lang ang ranggo ng mobile-friendly na site sa Google, at ganoon din ngayon ang kaso sa ibang mga SERP. 

Sa Elementor, hindi mo kailangang mag-alala tungkol sa pagiging kabaitan sa mobile dahil lahat ng mga template, libre man o bayad, ay tumutugon sa mobile pati na rin tumutugon sa tablet at desktop. Maaari mo ring i-edit kung anong mga feature ang makikita ng iyong mga user kapag nag-access sila mula sa mobile o desktop. 

Maaari mo silang bigyan ng iba't ibang karanasan sa parehong device, bagama't hindi inirerekomenda ang kasanayang ito dahil minsan ay maaaring bumuo ito ng kalituhan sa isip ng iyong mga user tungkol sa brand.

Paano makita ang pagiging tumutugon sa mobile ng iyong mga webpage

Sa ibaba ng tagabuo ng webpage, sa kaliwang sulok sa ibaba, makikita mo ang tatlong icon na may opsyong makita ang iyong webpage sa pamamagitan ng desktop, tablet, at mobile. Magiging pareho ang hitsura ng site para sa iba pang mga user pagkatapos mong i-publish ang iyong website.

Suriin ang Mobile Responsiveness ng Iyong Website

Mga tampok ng daloy ng trabaho:

  • Walang kinakailangang coding

Hindi mo kailangang maging isang dalubhasa o kahit na alam ng kaunti tungkol sa coding kapag gumagamit Elementor. Ang lahat ng mga widget na binanggit sa itaas ay drag at drop, at madali kang makakagawa ng high-end at naka-istilong web page gamit ang mga ito. 

Ang Elementor mismo ang nag-aalaga sa bahagi ng coding. Hindi lamang ito, ang ginamit na code ay na-optimize at pinaikli upang mabawasan ang oras ng pagkarga ng iyong webpage- isang napakahalagang salik para sa pagraranggo sa itaas.

  • Navigator Bar

Sa tulong ng nabigasyon, makikita mo ang istraktura na iyong idinisenyo sa webpage, ibig sabihin, ang pagkakasunud-sunod ng iyong pahina at ang daloy. Maaari mong baguhin, alisin, at i-duplicate ang mga widget kung gusto mo sa pamamagitan din ng Navigator bar.

Paano gamitin ang Navigation Bar

Upang gamitin ang Navigator, i-right-click lamang sa backend ng iyong web page na binuksan gamit ang Elementor at mag-click sa Navigator. May lalabas na pop-up, tulad ng ipinapakita sa larawan sa ibaba.

Paano Gamitin ang Navigation Bar

  • Mga Hotkey

Ang mga hotkey ay ang mga shortcut key sa pangunahing widget na nasa dashboard ng Elementor. Tingnan ang larawan para makita ang ilan sa mga pre-set na hotkey.

Elementor-Hotkeys

  • Inline na tampok sa pag-edit

Sa Elementor, hindi mo kailangang isulat ang iyong nilalaman sa ibang lugar at i-copy-paste at i-edit ang styling nito. Maaari kang mag-type nang direkta sa WordPress dashboard gamit ang nais na istilo at i-save ang iyong mahalagang oras.

Mga tampok ng disenyo

  • Mga Pandaigdigang Font

Sa tulong ng Elementor, maaari kang magtakda ng partikular na istilo ng font para sa iyong buong website sa isang click lang. Hindi mahalaga kung ito ay isang heading, isang talata, isang quote, o kahit isang call to action. 

  • Pandaigdigang Kulay

Katulad nito, habang nakatakda ang Global font, maaari mong itakda ang kulay ng iyong buong teksto ng website bilang pareho kung kinakailangan.

  • Background Gradients

Gamit ang tampok na kulay ng gradient, maaari mong sindihan ang background na iyong itinakda para sa bawat bloke at maging ang iyong homepage. Nalalapat ang mga gradient na kulay na ito sa bawat page na mayroon ka sa iyong website.

  • Mga Video sa Background

Maaari kang gumamit ng mga video bilang background sa Elementor. Ang mga video sa Background ay talagang magpapagaan sa iyong webpage.

Paano gamitin ang mga tampok ng disenyo sa Elementor

Ang lahat ng mga tampok na nabanggit sa itaas ay madaling mahanap sa Elementor dashboard, at magagamit mo ang mga ito sa pamamagitan lamang ng pag-click at pagsubok kung ano ang maganda sa iyong webpage.

  • Iba pang Mga Tampok
  • Ilapat ang Background overlay
  • Ilagay ang slideshow sa Background
  • Lumikha ng canvas para gawing buhay ang iyong page
  • Gumamit ng mga blend mode
  • Mga filter ng estilo ng CSS
  • Hinahati ang mga hugis
  • Anino ng kahon
  • Icon
  • I-export ang mga icon ng SVG mula sa iba pang mga website

Mga tampok sa layout

Maaari mong baguhin ang layout ng webpage at i-optimize ito upang maging maganda gamit ang iba't ibang feature na iyon Elementor nagbibigay, tulad ng lapad at taas ng seksyon, lapad ng column, puwang, at posisyon nito.

Maaari mo ring ayusin ang mga margin at padding, na isang napakahalagang feature na mayroon sa isang webpage. 

Mga Tampok ng Elementor Pro Plan

Mahahalaga

Maliban sa libreng feature, ang Elementor Pro ay may 2 pang feature na iaalok.

1. Pop-up builder

Maaari kang lumikha ng mga pop-up para sa pag-sign up, para sa isang limitadong oras na alok, at lumabas din sa mga pop-up ng layunin upang mapataas ang iyong mga benta at gawing mas kaakit-akit ang iyong pahina.

Ang tampok, tulad ng iba pang mga widget, ay naroroon sa dashboard ng Elementor.

Sa Pop-up builder, maaari kang bumuo ng mga sumusunod na pop-up:

  • Email Subscription
  • Mga pop-up ng Form sa Pag-login
  • Mga pop-up ng banner ng promosyon at benta
  • Pagkuha ng lead
  • I-lock ang nilalaman at ipakita ang mga pop-up
  • Mga Anunsiyo
  • Exit Intent
  • Mga pop-up na uri ng Welcome Mat
  • Mga kaugnay na produkto at upsells

2. Tagabuo ng Tema

Sa Elementor Pro, mayroon kang ganap na kontrol sa lahat ng feature na ginagamit mo sa iyong website. Magagawa mong idisenyo ang 404 na mga pahina at idirekta ang iyong mga gumagamit sa pahina na iyong pinili. 

Maaari mong pamahalaan ang header at footer sa parehong pahina kung saan ka nagdidisenyo. Sa malakas na WooCommerce Integration, maaari mo ring i-optimize ang iyong mga page ng produkto.

Mga tampok ng disenyo

1. Pasadyang CSS

Sa bawat widget na idaragdag mo, maaari kang magdagdag ng custom na CSS snippet para gawing mas personalized at kaakit-akit ang content. Ngunit para sa paggamit ng tampok na ito, dapat kang magkaroon ng isang disenteng kaalaman sa CSS. 

Ang paggamit nito nang walang anumang paunang kaalaman ay maaari ring pumunta sa timog. Kaya kung wala kang skill set, mas mabuting lumayo sa feature na Custom CSS.

2. Mga Epekto ng Paggalaw

Maaari kang magdagdag ng magagandang animation at bigyan ang iyong website ng uri ng cartoon. Nakakatulong ito na maakit ang isang partikular na target na madla at maaaring maging lubhang kapaki-pakinabang kung minsan. 

Paano gamitin ang tampok na disenyo sa Elementor

Well, hindi ito rocket science. Tulad ng iba pang mga widget, maaari kang mag-scroll sa panel ng dashboard at hanapin ang mga ito o i-type lamang ang pangalan ng widget sa panel ng paghahanap.

marketing

Ang mga tampok na ito ay ang mga wala sa Libreng bersyon ng Elementor.

  • Widget ng Form

Gamit ang tagabuo ng Elementor form, maaari kang gumawa ng iba't ibang mga pagbabago at gawing kawili-wili at kaakit-akit na punan ang iyong mga form.

  • Piliin ang layout na gusto mo at medyo madali ang spacing.
  • 10+ field na mapagpipilian, na gusto mo sa iyong form.
  • Pumili mula sa maraming kulay at typography na angkop at tumutugma sa disenyo ng webpage at scheme ng kulay.
  • Maaari ka ring lumikha ng mga dynamic na form
  • Kung kailangan mo ng long-form na may form builder ng Elementor, maaari mo itong buuin at hatiin ito sa maraming hakbang upang punan ito ng mga user sa madaling paraan.

Widget ng Form

  • Testimonial Carousel Widget

Testimonial Carousel Widget

  • Maaari mong gamitin ang mga paunang idinisenyong template na kasama ng Pro na bersyon ng Elementor at gumawa ng nakamamanghang testimonial na carousel para makakuha ng mas maraming conversion ang iyong negosyo.
  • I-align ang content at ang layout ng carousel. Magkaroon ng ganap na kontrol sa hitsura at pagkakahanay ng carousel.
  • Ang mga template ng pag-customize na ibinigay sa Elementor Pro ay madaling gamitin at nagbibigay ng user-friendly na karanasan sa parehong gumagawa nito at sa nakakakita nito.

Paano gamitin ang Testimonial Carousel Widget sa Elementor Pro

  • Maghanap ng Testimonial Slider sa dashboard search bar. Buksan ang widget, at maaari kang magsimula sa pamamagitan ng paggawa kaagad ng slider. Mayroong dalawang skin na pipiliin mula sa default at sa bubble. Piliin ang isa na kailangan mo ayon sa estilo.
  • I-align at i-finalize ang layout ng iyong mga testimonial, na maaaring gawin sa pamamagitan ng 5 opsyon Inline na larawan, stacked na larawan, larawan sa itaas, larawan sa kaliwa, at larawan sa kanan.
  • Piliin ang estilo at disenyo ayon sa iyong scheme ng kulay at magdagdag ng nilalaman sa slider.
  • Maaari mong i-autoplay ang mga slide sa slider, i-pause ito kapag nag-click dito ang mga user, o magtakda ng partikular na oras sa opsyon sa pagbabago ng slide. Mas gusto kong gamitin ang pause sa opsyon sa pakikipag-ugnayan para sa aking mga testimonial na slider.
  • Mga Link ng Aksyon

Maaari mong ikonekta ang iyong website sa WhatsApp, google calendar, at marami pang apps gamit ang Elementor Pro.

Paano gamitin ang mga link ng aksyon sa Elementor Pro

  • Pumunta sa Elementor dashboard at maghanap ng mga field ng link, na isa sa mga Pro widget na mayroon si Elementor.
  • Piliin ang dynamic na opsyon na available sa kanang sulok sa itaas ng pop-up ng widget.
  • Piliin ang URL ng contact sa ilalim ng opsyon sa pagkilos.
  • Idagdag ang lahat ng mga detalye na itatanong ng widget, at handa ka nang isama ang iyong contact platform sa iyong website.

Tampok ng Tagabuo ng Tema

  • Dynamic na Nilalaman
  • Gamitin ang hindi nagkakamali na Integration upang makagawa ng isang mahusay na dynamic na webpage.
  • Maaari kang magdagdag ng dynamic na kulay, mga larawan, kahit na mga logo ng website, at higit pa sa iyong webpage.
  • Ang pinakamagandang bagay ay maaari mong i-save ang layout ng dynamic na nilalaman na iyong ginawa at gamitin ito kahit saan sa buong website.

Paano gumamit ng dynamic na nilalaman sa Elementor Pro

Ipapakita ko ang halimbawa ng paggamit ng text editor at gawing dynamic ang content. Tiyaking nakikita mo ang lahat ng iba pang mga widget at subukan ang mga ito.

  1. Magbukas ng text editor at i-type ang text na gusto mo sa iyong webpage. Ngayon mag-click sa icon sa kanang sulok sa itaas ng editor, tulad ng ipinapakita sa larawan sa ibaba.
  2. Kapag nag-click ka sa icon, makikita mo ang isang listahan ng mga opsyon na lalabas sa pamamagitan ng isang dropdown. Ang mga ito ay inuri sa post, archive, at site. Piliin ang opsyon na gusto mo at simulan kaagad ang iyong trabaho.
  3. Ngayon upang higit pang i-edit ang pamagat ng iyong pahina, dapat kang mag-click sa isang icon, na isang wrench, tulad ng ipinapakita sa larawan sa ibaba.

Sa mga kahon na ipinapakita sa larawan sa itaas, ibig sabihin, bago, pagkatapos, at fallback, kailangan mong ilagay ang pamagat bago ang pagbabago, isang pamagat na dapat pagkatapos ng pagbabago, at pare-parehong nilalaman na ipapakita sa lugar ng dynamic na nilalaman kapag walang bago at pagkatapos ng pamagat.

Iba pang mga tampok ng tagabuo ng tema sa Elementor Pro

  • Kondisyon sa pagpapakita: Maaari kang magpasya kung ano ang ipapakita at kung saan ipapakita
  • Header at Footer: Sa simpleng pag-drag at pag-drop, maaari mong i-customize ang header at footer ng iyong web page
  • Malagkit na header: Magdagdag ng malagkit na header sa mga partikular na page o para sa iyong buong website sa buong mundo.
  • 404 page: Magdisenyo ng custom na 404 page at i-redirect ang iyong mga user at audience sa page na gusto mo.

Nilalaman ng Tema

  • Navigation Menu bar widget
  • Maraming pagpipilian sa pag-istilo na maaari mong piliin para sa iyong navigation bar.
  • Ang mga istilong ito ay tumutugon sa lahat ng device, at makikita mo ang mga ito sa mobile na bersyon at gawin ang mga kinakailangang pagbabago kung kinakailangan.
  • Maaari mong i-animate ang iyong navbar gamit ang animation at hover effect. Ito ay talagang lumiliwanag sa iyong pahina.
  • Maaari mong piliin kung paano ilagay ang menu, ibig sabihin, pahalang, patayo, tingnan ito bilang full screen, maaaring subukan ang pagpipiliang hamburger.

Paano gamitin ang widget ng navigation menu bar

  1. Tumungo sa dashboard at hanapin ang menu bar
  2. Maaari mong itakda ang iyong menu sa pahalang, patayo, o isang dropdown ayon sa istilong mukhang maganda sa iyong website.
  3. Maaari ka ring magdagdag ng isa at dobleng lining sa ibaba ng bawat nilalaman ng menu upang i-highlight at kahit na baguhin ang kulay ng teksto sa pamamagitan ng dashboard.
  • Maghanap ng Widget

Ang widget ng paghahanap ay may tatlong skin: ang default, minimal, at full-screen na widget sa paghahanap.

Maaari mong i-tweak ang disenyo ng search bar pati na rin ang pindutan upang tumugma sa iyong estilo ng webpage.

Paano gamitin ang search bar sa Elementor Pro

Tumungo sa dashboard ng Elementor at hanapin ang widget ng search bar, piliin ang estilo na gusto mo, default, full-screen o minimal at baguhin ang typography at mga kulay ng search bar upang tumugma sa iyong tema ng kulay.

  • Iba pang mga tampok ng nilalaman ng tema na makukuha mo sa Elementor Pro
  • Mag-post ng widget: Baguhin ang hitsura ng sidebar sa pamamagitan ng paglalagay ng iyong mga kamakailang post doon.
  • Widget ng komento ng WordPress: Gamit ang widget na ito, maaaring magkomento ang mga mambabasa tungkol sa post na iyong isinulat.
  • Portfolio widget: Kung marami kang mga portfolio na ipapakita, gamitin ang portfolio widget na ito upang ipakita ang mga ito sa isang makabago at kaakit-akit na istilo.

Ang lahat ng mga tampok na ito ay magagamit sa pangunahing dashboard ng Elementor, katulad ng iba pang mga widget. Tiyaking tinitingnan mo ang lahat ng feature na ito.

integrations

Ang pinakamakapangyarihang feature na makukuha mo sa Elementor Pro ay ang kapangyarihan ng Integration. Tingnan natin kung ano ang maaaring isama ng lahat ng plugin at tool sa Elementor at kung paano gamitin ang mga ito.

  • MailChimp

Ang Mailchimp ay ang nangungunang marketing automation software pagdating sa email marketing. Ang hanay ng mga tampok na ibinibigay ng Mailchimp ay natatangi at nakakahimok. Sa Pagsasama ng Mailchimp at Elementor Pro, makakagawa ka ng mga kababalaghan.

Ngunit paano i-set up ang Mailchimp sa Elementor? Tingnan sa ibaba. Mawawala ang lahat ng iyong pagdududa.

Mga hakbang para isama ang Mailchimp sa Elementor sa 4 na simpleng hakbang

  1. Itakda muna ang Mailchimp API. Para sa paggawa nito, pumunta sa setting ng Elementor at buksan ang tab ng pagsasama
  2. Ngayon ay kailangan mong piliin ang artikulo, form, o anumang iba pang nilalaman na kailangan mong i-promote sa pamamagitan ng email.
  3. Pagkatapos piliin ang nilalaman, magpatuloy at mag-click sa Mailchimp mula sa isang listahan ng mga tool sa pagsasama na ipinapakita sa iyong screen.
  4. Itakda ang API, at maaari kang gumamit ng default o baguhin ito sa customs, piliin ang iyong target na madla, piliin ang pangkat na kinakailangan, gumamit ng pinakamainam na mga tag para sa email marketing depende sa iyong niche. Pagkatapos piliin ang lahat ng opsyong ito, maaari mong lagyan ng check ang field mapping box, at handa ka nang umalis.
  • ActiveCampaign

Tulad ng Mailchimp, ang ActiveCampaign ay isa ring marketing automation software. Tinutulungan ka nitong kumonekta sa iyong target na madla sa pamamagitan ng mga diskarte sa marketing at remarketing.

Paano isama ang Mga Aktibong Campaign sa Elementor Pro

  1. Itakda muna ang ActiveCampaign API. Para sa paggawa nito, pumunta sa setting ng Elementor at buksan ang tab ng pagsasama
  2. Ngayon ay kailangan mong piliin ang artikulo, form, o anumang iba pang nilalaman na kailangan mong i-promote sa pamamagitan ng email.
  3. Pagkatapos piliin ang nilalaman, magpatuloy at mag-click sa ActiveCampaign mula sa isang listahan ng mga tool sa pagsasama na ipinapakita sa iyong screen.
  4. Tiyaking punan mo ang lahat ng mga field na nabanggit, tulad ng email, pangalan, apelyido, at pangalan ng organisasyon.
  • HubSpot

Ang HubSpot ay isang kumpletong pakete ng marketing at dinadala ang iyong website sa mga bagong antas. Nag-aalok ito sa iyo ng CRM, automation, serbisyo sa pagbebenta, at maraming integrasyon upang magamit.

Paano isama ang HubSpot sa Elementor Pro

  1. I-download ang Plugin HubSpot All-In-One Marketing mula sa seksyong plugin ng WordPress. Mag-login sa portal at suriin kung tama ang mga setting.
  2. Pagkatapos ay maaari kang pumunta sa menu ng HubSpot at i-link ang iyong kasalukuyang Elementor account sa HubSpot, at maaari kang magsimula sa isang power pack marketing performance.
  • Zapier

Ang Zapier ay isang automation tool na nagbibigay sa iyo ng access sa 1000+ pang web integration para matulungan ka sa bawat functionality na kailangan mo sa iyong website.

Paano isama ang Zapier sa Elementor Pro

Ang Zapier ay pangunahing ginagamit upang isama ang iyong Elementor Form dito.

Upang gawin ito, pumunta sa widget ng Elementor Form at gumawa ng mga pag-edit sa form na gusto mong isama sa Zapier, tulad ng ipinapakita.

Kakailanganin mong kopyahin ang isang Hook mula sa Zapier at pagkatapos ay buksan ang Webhook sa form at i-paste ang hook doon upang i-link ang iyong form sa Zapier.

Kapag tapos na, maaari mong subukan ang form sa Zapier, at handa ka nang umalis.

  • Iba pang mga Integrations
  • Adobe TypeKit: Upang makuha ang nais na istilo ng font.
  • Discord: Para sa pagsusumite ng forum
  • GetResponse: Magdagdag ng ilang bisita nang sabay-sabay sa isang listahan
  • ReCaptcha V3: Magdagdag ng karagdagang seguridad sa iyong mga form at web page
  • Facebook SDK: Pamahalaan at tumugon sa lahat ng komento na iniiwan ng mga user sa iyong mga post sa Facebook
  • Mabagal: Bigyan ang iyong koponan ng plataporma para makapag-usap
  • Mga Custom na Icon na Aklatan: Pumili ng mga icon mula sa walang katapusang magagamit na mga opsyon at gamitin ang mga ito nang libre sa Elementor Pro

Pagpepresyo ng Elementor Pro

Ang plano sa pagpepresyo ng Elementor pro

Suriin ang User 

Pagsusuri ng user Pagsusuri ng user Pagsusuri ng user

Quick Links:

Mga FAQ Sa WordPress Elementor Tutorial

✅Available ba ang Integrations sa libreng bersyon ng Elementor?

Available ba ang Mga Pagsasama sa libreng bersyon ng Elementor?

🤷‍♀️ Kumusta naman ang customer service ng Elementor?

Maaari kang mag-opt-in para sa serbisyo sa customer ng Elementor kasama ang kanilang bayad pati na rin ang kanilang libreng plano. Tinatrato ng Elementor ang lahat ng kanilang mga customer sa parehong paraan at parehong pamamaraan. Maaari kang makipag-ugnayan sa kanila sa pamamagitan ng email o tawagan sila sa walang bayad na numero. Maipapayo na i-mail mo muna sila, dahil tatawagan ka ng kanilang technician depende sa kalubhaan ng problema.

👍Ano ang mas gustong Libreng Elementor o ang Pro na bersyon?

Makakatulong kung sinimulan mo ang libreng bersyon ng Elementor, gagawa ng mga pangunahing web page at gawing buo ang iyong website. Pagkatapos mong makita na ang iyong website ay nakakakuha ng maraming trapiko, maaari kang lumipat sa Elementor Pro dahil ito ay magbubukas ng mga pinto sa walang katapusang mga pagkakataon at makakatulong din sa iyo sa marketing ng produkto kasama ang mga makapangyarihang pagsasama nito.

⁉️Gaano Kadali Gamitin ang Elementor / Maganda ba ang Elementor para sa mga nagsisimula?

Ang Elementor ay ang pinakasimpleng tagabuo ng pahina na gagamitin, ngunit mayroon din itong pinakamaraming pag-andar nang libre. Sa totoo lang, ito ang perpektong opsyon sa paggawa ng sarili para sa sinumang naghahanap upang makabuo ng mga kamangha-manghang disenyo ng website nang walang anumang coding, HTML, o CSS na kadalubhasaan.

☑️Mas maganda ba ang Divi kaysa sa Elementor?

Parehong nagbibigay ang Elementor at Divi ng mga sopistikadong kakayahan sa paggawa ng page. Ang Elementor ay magagamit nang libre, at ang isang PRO na edisyon ay magagamit para sa $ 49. Ang Divi ay $ 89 sa isang taon at nagbibigay-daan sa iyo na lumikha ng isang walang katapusang bilang ng mga website. Habang intuitive ang Divi Builder, mas mabilis na magtrabaho si Elementor. Inirerekomenda namin ang Elementor.

👍Alin ang mas mahusay na Beaver Builder o Elementor?

Ang Beaver Builder ay kulang sa tiyak sa mga mas sopistikadong feature sa pag-customize na available sa Elementor Pro at iba pang solusyon tulad ng Divi Builder ngunit kumikinang sa iba. Mabilis na naglo-load ang UI at nagtatampok ng diretso, madaling maunawaang istilo. Pinapabilis nito ang proseso ng paglikha ng mga natatanging layout. Inirerekomenda namin ang Elementor.

📓Ano ang pinakamagandang add-on para sa Elementor?

Marami, ngunit kung isa kang user ng Elementor na gustong dagdagan ang paggana ng tagabuo ng pangunahing pahina gamit ang mga malikhaing bahagi at widget, sulit na subukan ang Mga Mahahalagang Addon. Bukod pa rito, ang Essential Addons ay may kasamang matatag na tulong sa customer sa anyo ng live chat at suporta sa ticket upang matulungan kang lutasin ang anumang mga problema.

Gayundin, Basahin:

Konklusyon: Tutorial sa WordPress Elementor 2024

Isa sa nangungunang software sa pagdidisenyo ng web page, Elementor, ay isang maaasahan at matingkad na platform para buuin ang iyong website. Mula sa paglikha ng isang pangunahing pahina ng blog hanggang sa paglikha ng isang naka-istilo at nakamamanghang landing page ng produkto, lahat ay maaaring gawin sa Elementor.

Ang Pro na bersyon ng Elementor ay may walang katapusang mga tampok upang gumana at dalhin ang iyong website sa isang bagong antas. Nagbibigay ito sa iyo ng kalayaan na magkaroon din ng kabuuang kontrol sa iyong website.

Hindi mo kailangang maging isang coder para magamit ang Elementor. Ang paggamit ng Elementor ay kasing simple ng pag-aaral kung paano mag-click at mag-drag at mag-drop ng mga feature.

Oo, nangangailangan ng kaunting oras upang makita ang lahat ng mga tampok at malaman kung anong mga tampok ang kapaki-pakinabang para sa iyong website, ngunit ang oras na ilalaan mo sa Elementor ay magiging sulit sa bawat bit, masisiguro ko sa iyo iyon.

Kaya, subukan ang Elementor at ipaalam sa akin ang iyong karanasan sa pamamagitan ng pagkomento sa ibaba! 

Mga Sikat na Video ng Elementor

Elementor Sa Social Media

Tutorial sa WordPress Elementor

PANGKALAHATANG VERDICT

Ang isa sa mga nangungunang webpage na nagdidisenyo ng software, ang Elementor, ay isang maaasahan at pinakamatingkad na platform para buuin ang iyong website. Mula sa paglikha ng isang pangunahing pahina ng blog hanggang sa paglikha ng isang naka-istilo at makapigil-hiningang landing page ng produkto, lahat ay maaaring gawin sa Elementor.
8.5

Sa labas ng 10

Mga kalamangan

Kahinaan

MARKA:

presyo: $

Diksha Dutt

Isang nagtapos ng IIMC, nasisiyahan si Diksha na pag-usapan ang tungkol sa paglaki ng sarili at mga platform sa online na pag-aaral. Si Diksha ay may hilig para sa edukasyon at entrepreneurship, at siya ay kasangkot sa parehong larangan sa loob ng mahigit isang dekada. Nilalayon niyang tulungan ang iba na gumawa ng mas matalinong mga desisyon tungkol sa pinakamahusay na online na mapagkukunan, kurso, at platform ng edukasyon. Nagsusulat siya tungkol sa mga platform sa online na pag-aaral at mga online na kurso sa Megablogging.org, kung saan sinusuri at inirerekomenda niya ang pinakamahusay na mga mapagkukunan para sa iba't ibang antas ng kasanayan at layunin. Kapag hindi nagtatrabaho si Diksha, nasisiyahan siya sa pagbabasa ng mga libro, paglalaro ng chess, at paglalakbay kasama ang kanyang asawa at dalawang anak. Maaari mo siyang sundan LinkedIn at Facebook.

1 naisip sa “WordPress Elementor Tutorial | Isang Step By Step Guide Sa 2024”

  1. Napakahusay na post. Natisod lang ako sa iyong weblog at gusto kong banggitin na minahal ko talaga
    nagba-browse sa iyong mga post sa blog. Pagkatapos ng lahat, magsa-subscribe ako sa iyong feed
    at sana magsulat ka ulit sa lalong madaling panahon!

Mag-iwan ng komento

Elementor
0 Mga Pagbabahagi
tiririt
magbahagi
magbahagi
aspile