Блог

Шорткод гэж ер нь чухам юу юм бэ?

Хэрэв та анзаарсан бол WordPress-ийн баримталдаг гол зарчмуудын нэг нь шинээр эхлэгчид болон туршлагатай хөгжүүлэгчдийн хэнд нь ч бүх зүйлийг үргэлж, дандаа бага ч болов хялбарчлах явдал байдаг. Тэдний энэхүү зорилгодоо хүрэх нэг арга нь шорткод (shortcode)-уудыг ашиглах явдал юм.

WordPress.com-ын Тусламжийн хуудас тэдгээрийг дараах байдлаар тодорхойлсон байдаг:

Хангалттай энгийн сонсогдож байгаа биз. Хэрэв та энэ нийтлэлээс өмнө шорткодын талаар сонсож байгаагүй, ямар харагддагийг нь мэдэхгүй бол тэдгээр нь дөрвөлжин хаалтанд хашигдсан, эртний код мэт харагдах текстүүд юм.

Ихэвчлэн иймэрхүү харагддаг энгийн кодтой харьцуулахад:

(Ээ дээ. Юу гэнэ ээ?)

Шорткодууд ерөнхийдөө иймэрхүү харагддаг:

(Амархаан.)

…хэрэв та хөгжүүлэгч бол (эсвэл компьютер дээр ядаж хоёр удаа сууж үзсэн хүн ч гэсэн), ганц жижиг даалгаврыг гүйцэтгэхийн тулд бичиж, товшилт хийх нь л гэхэд таны маш их цагийг бардаг гэдэгтэй санал нийлэх байх. Бидэнд гарны товчлолууд байдагтай яг ижил шалтгаанаар, бид бүхний ажлыг хялбарчилж, илүү сайн зүйлс хийж бүтээх цаг хэмнэхийн тулд шорткодууд оршдог; тэд яг ижил зорилго агуулдаг гэдгээрээ товчлолын товчлууруудтай тун төстэй юм.

Одоо дээрхтэй адил энэхүү тодорхой шорткод руу эргэн орцгооё:

Үүнийг embed shortcode гэж нэрлэдэг бөгөөд WordPress-д анхнаасаа суурилсан байдаг. Энэ нь тухайн URL-аас видеог таны контент руу суулгаж өгдөг. Хэрэв та одоо WordPress ашиглаж байгаа бол дээрх шорткодыг өөрийн сайт руу хуулж тавиад туршиж үзэж болно.

Гэхдээ шорткодууд нь цаг хэмнэх төгс шийдэл биш юм. Бид өмнөх нийтлэлдээ шорткод яагаад өөрийн гэсэн сул талуудтай байдаг, Sandwich-ийн баг тэдгээрийг засахын тулд юу бэлтгэж байгаа талаар илүү дэлгэрэнгүй авч үзсэн билээ.

Одоохондоо шорткодуудыг чөлөөтэй туршиж үзээд, таны төлөө тэд юу хийж чадахыг хараарай.

Сайт бүтээх ажилд тань амжилт хүсье!

10 сар 2, 2026
Шорткодуудын хэлэгдээгүй асуудал

Шорткод (Shortcode) нь WordPress-ийн хамгийн оргил боломжуудын нэг юм. Шорткод нь хөгжүүлэгчид болон сайт бүтээгчдийн хоорондох гүүр болж, хүмүүст хүссэн бараг бүх газартаа нарийн нийлмэл агуулгыг байрлуулах боломжийг олгодог. Залгаас бүтээгчид хэрэглэгчиддээ агуулгаа хаана, хэрхэн харуулах тал дээр илүү уян хатан байдал олгодог тул шорткодод дуртай байдаг.

Хэрэв та шорткод гэж юу болох, ямар харагддагийг мэдэхгүй бол энэ нь дөрвөлжин хаалтанд хашигдсан, хуучны код шиг бичвэрүүд юм. Тэд ойролцоогоор иймэрхүү харагддаг:

Энэ тодорхой шорткодыг embed гэж нэрлэдэг бөгөөд энэ нь WordPress-д анхнаасаа суурилагдсан байдаг. Энэ нь тухайн URL-аас видеог таны агуулга руу суулгаж өгдөг. Хэрэв та туршиж үзэхийг хүсвэл дээрх шорткодыг хуулж аваад өөрийн сайтдаа буулгахад л хангалттай.

Хөшигний цаана юу болдог вэ гэвэл WordPress таны агуулга дотор шорткодтой таарах үед түүнийг боловсруулан өөр зүйл болгон хувиргадаг. Дээрх бидний жишээн дээр,

шорткод илэрвэл WordPress шорткод дахь URL-ыг авч өөрт байгаа хэд хэдэн контент нийлүүлэгчидтэй харьцуулан шалгадаг. Тохирох нэгийг олмогц тохирох iframe embed кодыг авч, оронд нь түүнийг харуулдаг.

Тэгвэл энд юу нь асуудал болоод байна вэ? Хаалттай богино текст оруулаад л болоо юм шиг, тун амархан сонсогдож байна.

Шорткод API-г танилцуулж байна..

Шорткодын элбэг дэлбэг байдал

Shortcode API нь шорткод үүсгэх боломжийг хөгжүүлэгчдэд нээж өгдөг. Үүний ачаар хөгжүүлэгчид өөрсдийн залгаасууд дотор өөрсдийн гэсэн шорткодуудыг нэмэх боломжтой болсон.

Энэ нь гайхалтай бөгөөд одоо ердөө л богино код шиг хэсгээр (иймээс ч “shortcode” гэж нэрлэсэн) анхан шатныхан болон ахисан түвшний хэрэглэгчдийн аль аль нь хүссэн ямар ч төрлийн агуулгыг хүссэн газартаа байрлуулах боломжтой болсон.

WordPress нь анхдагч тохиргоогоороо цөөн хэдхэн шорткодтой байдаг. Тэдгээрийн тоо цөөн тул цээжээр бичихэд амархан. Гэвч хэрэв та хэд хэдэн залгаас суулгавал шорткодын тоо арав гаруй, зарим тохиолдолд зуу гаруй болж огцом өсдөг. Шорткод бүр өөрийн гэсэн шинж чанарууд болон тэдгээрийг хэрхэн ашиглах заавартай байдаг. Залгаас бүр өөрийн бүх шорткодууд хэрхэн ажилладаг тухай ямар нэгэн баримт бичигтэй байх магадлалтай бөгөөд тэдгээрт байгаа бүх параметрүүдийг жагсаасан байдаг. Гэхдээ та бүх шорткод болон тэдгээрийн шинж чанаруудыг цээжлэх гэж оролдвол галзуурна биз ээ.

Асуудал нь таны сайтад байгаа бүх шорткод болон тэдгээрийг хэрхэн ашиглах талаар олж мэдэх нэгдсэн төвлөрсөн хэсэг байхгүйд оршино.

Зарим нь асуудлыг шийдэх гэж оролддог

Зарим залгаасууд өөрсдийн бүх шорткодыг хялбар хандах боломжтой унждаг цэсэнд харуулж энэ асуудлыг шийдэхийг оролддог. Дараа нь аль нэг дээр нь дарахад боломжит бүх шинж чанаруудын хамт шорткодыг гаргаж ирнэ. Үүнийг цээжлэх шаардлагагүй болсон нь сайн хэрэг.

Зарим нь бүр цаашилж, шорткодын шинж чанаруудыг бөглөхийн тулд сонгох нүднүүд болон өнгө сонгогч бүхий тохиргооны попап маягтыг нэмдэг.

Энэ шийдэл тодорхой хэмжээнд ажилладаг. Гэсэн хэдий ч залгаас бүр зөвхөн өөрийн шорткодуудыг жагсаадаг. Тиймээс залгаас бүр өөрийн гэсэн шорткод сонгогчийг үүсгэвэл таны дэлгэц дээр олон тооны шорткод сонгогч гарч ирэх үе гарцаагүй тохиолдох болно (Надад ч өмнө нь ийм явдал тохиолдож байсан).

Өөрөөр хэлбэл, залгаас бүр өөр өөрийнхөөрөө ажиллаж, өөрийн шорткодуудад зориулан тус тусын шийдлийг хэрэгжүүлдэг. Зарим залгаасууд “Add Media” товчны хажууд шинэ товч нэмдэг бол зарим нь TinyMCE дотор шинийг нэмдэг.

Тэгэхээр та одоо “Бусад залгаасын шорткодуудыг бас цуглуулаад унждаг цэс / шорткод сонгогчдоо оруулаад явчихаж болохгүй гэж үү?” гэж бодож байж магадгүй. Миний бодсон зүйл яг тэр байсан юм. Гэвч үүнийг ярихад амархан ч хийхэд хэцүү. Яагаад гэдгийг би тун удахгүй тайлбарлах болно, харин эхлээд хамгийн тохиромжтой төгс шийдэл ямар харагдахыг авч үзье.

Хамгийн тохиромжтой төгс шийдэл

Төгс төлөвлөгөө нь таны сайт дахь бүх боломжит шорткодуудыг цуглуулж, жагсаалтыг танд үзүүлэн, бүх шинж чанарыг бөглөхөд тусалдаг залгаас бүтээх явдал юм. Мөн шинэ залгаас суулгах болгонд шинээр орж ирсэн бүх шорткодууд танд мөн адил харагдах болно.

Таны бүх шорткодыг хялбар хандах үүднээс төвлөрүүлэн байрлуулсан нэг төв цэгийг төсөөлөөд үз дээ. Шорткод бүр юу хийдэг, аль залгаасанд хамаардгийг тайлбарласан байна. Тэгээд боломжит шинж чанар бүрийн хувьд нэр хаяг, тэдгээрийн утгыг сонгох зөв арга зам, тайлбар зэрэг байна гээд төсөөлөөрэй. Танд унждаг цэс, өнгө сонгогч, радио товчлуур, сэлгүүр гэх мэт бүх зүйл харагдах болно.

Иймэрхүү зүйл нь вэбсайт болон контент бүтээгч бидний амьдралыг хамаагүй хялбар болгох байсан. Ашиглахыг хүссэн слайдерынхаа үүсгэгдсэн шорткодыг хуулж авахын тулд өөр өөр заавар баримтуудыг эсвэл админ хэсгийнхээ өөр өөр булангуудыг шалгах шаардлагагүй болно.

Анхаарах зүйл

Харамсалтай нь, яг одоогоор ийм зүйл хийх нь нэлээд бэрхшээлтэй юм. Шорткодын бүх нарийн ширийн мэдээллийг мэдэх баталгаатай арга байхгүй. Та бүх шорткодын жагсаалтыг авах боломжтой боловч зөвхөн тэдний бодит шошго/нэрийг л авна, шинж чанаруудын жагсаалт, тэдгээр нь юу хийдэг, тэдгээрийн төрөл нь тэмдэгт мөр, өнгө эсвэл тоо эсэх зэрэг нэмэлт мэдээллийг авах боломжгүй. Мөн шинж чанар бүрийн хувьд ямар нэг тайлбар төдий зүйлийг ч авах боломжгүй юм.

Хөгжүүлэгчдэд зориулсан сануулга: тийм ээ, shortcode_atts функцэд шинээр нэмэгдсэн гуравдагч аргумент байгаа хэдий ч энэ нь заавал шаардагдах аргумент биш юм. Тиймээс дэлхий дээрх бүх залгаас хөгжүүлэгчид үүнийг нэвтрүүлэхгүй л бол бидэнд шорткодын бүх шинж чанарыг тодорхойлох найдвартай арга байхгүй хэвээр байх болно.

Shortcode API нь шорткодын тайлбар нэмэх, шинж чанарын төрлийг зааж өгөх эсвэл шинж чанарын тайлбар оруулах ямар ч боломжийг олгодоггүй. Тэгээд WordPress өөрөө шорткодод хандах нэгдсэн хэсгийг нэмэхгүй л бол энэ боломж бий болно гэдэгт би эргэлзэж байна.

Дүгнэлт

Одоогоор шорткодыг цэгцлэх ажил нь хөгжүүлэгч тус бүрийн дур зоргод үлдсэн байна. WordPress дотор нэгдсэн арга барил бий болохгүй бол та өөрийн удирдлагын хэсэгт олон тооны “Add Shortcode” товчлууруудыг үргэлжлүүлэн харсаар байх болно. Ийм зүйлийг WordPress Core-д нэмэх ёстой эсэх нь өөрөө бие даасан томоохон хэлэлцүүлэг юм.

Өөр нэг гарц

Үүнийг өөрөөр шийддэг хуудас бүтээгч залгаасууд байдаг. Тэд шорткодуудыг програмын аргаар илрүүлэхийн оронд хэрэглэгчид шорткодын бүх нарийн мэдээллийг гараар оруулах боломжтой шорткод буулгагчтай байдаг. Үүнийг хийж дуусмагц тухайн хуудас бүтээгч дотор ашиглах боломжтой болдог. Хэдийгээр энэ нь ажилладаг ч зөвхөн таны өөрийн сайтад л ашиглагдах боломжтой.

Page Builder Sandwich-ийн зүгээс бид энэхүү шорткодын таавар мэт ээдрээтэй асуудлыг шийдэж чадах ямар нэгэн зүйлийг бүтээж байна. Бидний явцын талаар мэдээлэл авч байхын тулд доорх манай товхимолд бүртгүүлээрэй.

10 сар 2, 2026
Хуудсандаа загварлаг газрын зураг нэмэх нь интерактив туршлага юм
Та одоо Page Builder Sandwich-ийг ашиглан хуудасныхаа загварт газрын зураг оруулах боломжтой боллоо!

Газрын зурагт сэтгэл догдлох нь хачин санагдаж магадгүй. Та Google Map-ын холбоосыг хуулж суулгадаг. Эсвэл интернетээс газрын зургийн нэмэлт өргөтгөл (plugin) аваад богино код (shortcode) тавьдаг байх. Эсвэл таны өөр хуудас бүтээгч дээр аль хэдийн ийм боломж байдаг бөгөөд та хүссэн үедээ нэмж болдог байх. Гэхдээ бидний баярлаж буй шалтгаан нь бид газрын зураг нэмэх үйл явцыг цоо шинэ түвшинд авчирсанд оршино.

Урьдчилан харах хэсэг:

Газрын зураг нэмэх хуучны уйтгартай арга

Энгийн хуудас бүтээгчээр газрын зургийг хэрхэн нэмдэг вэ:
1. Та газрын зургийн шинэ элементийг чирж тавина,
2. Та өргөрөг болон уртрагыг талбарт оруулна,
3. Та газрын зургийн өндөр, өргөн гэх мэт бусад утгуудыг талбарт оруулж, замын хэв маягийг сонгох зэрэг тохиргоог хийнэ,
4. Урьдчилан харах товчийг дарж, ямар харагдаж байгааг шалгаад илүү гоё харагдуулахын тулд ямар нэг зүйлийг өөрчлөх хэрэгтэй гэж шийднэ,
5. Хуудас бүтээгч рүү буцаж очоод утгуудыг өөрчилж, дээрх 4-р алхмыг давтана.
Page Builder Sandwich ашиглан газрын зураг нэмэх арга

Вэбсайт дахь газрын зураг нь интерактив байдаг – та газрын зургийг нааш цааш гүйлгэж, томруулж, жижигрүүлж болно. Тиймээс бид ямар ч таамаглал хийх шаардлагагүйгээр, хуудсаа бүтээх явцдаа газрын зурагтай шууд харьцах боломжийг олгож яагаад болохгүй гэж бодсон юм.

Page Builder Sandwich ашиглан газрын зургийг хэрхэн нэмэх вэ:
1. Та газрын зургийн элемент нэмнэ,
2. Та газрын зургийн төвлөрүүлэхийг хүссэн өргөрөг, уртраг эсвэл хаягийг бичнэ,
3. Та хүссэн харагдах байдлаа гаргахын тулд газрын зургийг хөдөлгөж, томруулж эсвэл жижигрүүлнэ,
4. Өөрийн хэв маягт нийцүүлэн газрын зурагтаа гоёмсог өнгө нэмнэ,
5. Хадгалах товчийг дарна.
Бидний арга нь хамаагүй илүү сонирхолтой бөгөөд ойлгомжтой. Та ердийн Google Map ашиглаж байгаа шигээ газрын зурагтай харьцах болно.

Өнгөт газрын зураг эсвэл SnazzyMaps-ээр хэв маяг оруулах

Бидний нэмсэн гайхалтай нэг боломж бол газрын зургийн өнгө аясыг өөрчлөх, будах чадвар бөгөөд үүнийг хийхэд маш хялбар. (Энэ нь зөвхөн дээд зэрэглэлийн /premium/ хувилбарт зориулагдсан). Хэрэв та газрын зургаа өнгөтэй болгохыг хүсвэл манай өнгө сонгогч дээр дарж өнгөө сонгоход л таны газрын зураг шууд өөрчлөгдөнө.

Энд бидний ягаан туяатай болгосон газрын зураг байна:

Page Builder Sandwich нь мөн SnazzyMaps-аар дамжуулан илүү нарийн өнгөний схемүүдийг дэмждэг. Тэдэнд хэрэглэгчдийн үүсгэсэн асар олон өнгөний схемүүд байдаг бөгөөд хэрэв та өнгөө илүү нарийн хянахыг хүсвэл өөрийнхийг үүсгэх боломжийг олгодог.

Зүгээр л өөрт таалагдсан өнгөний схемээ олоод, кодыг нь хуулж Page Builder Sandwich-д буулгахад хангалттай. Өнгөний схем таны газрын зурагт шууд хэрэгжинэ.

Энд SnazzyMaps-аас авсан papuportal dark:

Газрын зургийг хүссэн газраа байрлуул

Газрын зураг дээр хийж болох өөр олон сонирхолтой зүйлс бий – жишээлбэл илүү хүчтэй сэтгэгдэл төрүүлэхийн тулд бүтэн өргөнтэй мөрөнд нэмэх боломжтой. Хэрэв хүсвэл тойруулга (carousel) дотор эсвэл таб (удахгүй гарах боломж) дотор ч нэмж болно.

Хэрэв та Page Builder Sandwich-ийг хараахан аваагүй бол дээрх “Live Demo” холбоос.
10 сар 2, 2026
Цагаан зай яагаад чухал болох 5 шалтгаан

Ерөнхийдөө цагаан зай буюу whitespace нь хамгийн үндсэн утгаараа зохиомжийн бүх элементүүдийн эргэн тойронд болон хооронд юу ч тэмдэглэлгүй үлдээсэн зай юм. Ихэнх вэбсайт эзэмшигчдийн боддог шиг энэ нь дэлгэцийн зайг дэмий үрж буй хэрэг биш. Зөв ашиглавал цагаан зай нь бүтээгдэхүүнийг илүү сайн сурталчлахад бодит үр өгөөж өгч чадна. Энэ нь сайн дизайн бүтээх чухал түлхүүр бөгөөд вэбсайтыг бүхий л талаар илүү сайн болгодог.

Хэдийгээр цагаан зай (whitespace) гэдэг нэр нь зайг цагаан өнгөтэй гэсэн утга илэрхийлдэг ч заавал яг цагаан байх албагүй. Цагаан зай нь үнэндээ ямар ч өнгөтэй байж болох бөгөөд бүр үл мэдэг хээ эсвэл бүтэцтэй ч байж болно. Энэ бол хүний нүдийг бүү анхаараасай гэж хүсэж байгаа хэсэг юм. Үүнийг өөрөөр сөрөг орон зай (negative space)

Тэгвэл цагаан зай яагаад чухал вэ?

Зургийн эх сурвалж: News Feed

Шалтгаан #1: Уншихад хялбар болгоно

Суурь мөрүүд болон догол мөр хоорондын цагаан зай нь хүмүүст сайтын бүх агуулгыг ая тухтай уншихад бодитоор тусалдаг. Сайтынхаа жижиг нарийн ширийн зүйлсийг (мөр хоорондын зай эсвэл үсэг хоорондын зай гэх мэт) тохируулах нь уншихад хялбар болгоход асар их өөрчлөлт авчирч чадна.

Зорилго нь нүдэнд эвтэйхэн бүтцийг зохион бүтээх замаар хүмүүст үргэлжлүүлэн унших хүсэл төрүүлэх явдал юм.

Зургийн эх сурвалж: HP Magic Words

Шалтгаан #2: Харилцан үйлдлийг хурдасгана

Нээлттэй хэлэхэд: танай ихэнх зочид вэбсайтуудыг үзэж байхдаа нарийвчлан харах хангалттай тэвчээргүй байдаг. Вэбсайт хэт бөөгнөрсөн харагдах үед энэ нь хэрэглэгчдийн хайж буй зүйлээ олоход нь саад болж, анхаарлыг нь сарниулдаг.

Цагаан зай нь зочны анхаарлыг хуудсаар хөтлөхөд туслах ёстой. Анхаарал татах гэж өрсөлдөх элементүүд цөөн байж, цагаан зайг зохистой ашигласнаар зочдыг саатуулах анхаарал сарниулагч хүчин зүйлсээс сэргийлж чадна.

Зургийн эх сурвалж: Google

Шалтгаан #3: Анхаарлыг зөв элементүүд рүү чиглүүлнэ

Цагаан зай нь хэрэглэгчдэд хаашаа харах ёстойг харуулсан харааны дохиог өгч чаддаг. Зөв ашигласан тохиолдолд цагаан зай нь мэдээллийг тодотгож, вэбсайтынхаа тодорхой нэг хэсэгт анхаарлыг татахад тусалдаг.

Бүх зүйл тодорч байвал юу ч тодорч харагдахгүй гэдгийг санаарай.

Зургийн эх сурвалж: Pocket Penguins

Шалтгаан #4: Анхны сэтгэгдэл чухал

Вэбсайтын өнгө төрх, ерөнхий сэтгэгдэл нь анхны сайн сэтгэгдэл төрүүлэх гол түлхүүр юм. Анхны сайн сэтгэгдэл нь ихэвчлэн зочлох хугацааг уртасгахад хүргэдэг. Хэтэрхий бага цагаан зай нь таны вэбсайтыг хямдхан бөгөөд найдваргүй харагдуулж мэднэ. Вэбсайт нь сэтгэл татам харагдахгүй бол зочид уг сайт болон брэндийг найдвартай гэж үзэхгүй. Хангалттай хэмжээний цагаан зайтай байх нь таны вэбсайтын зөв өнгө аясыг бүрдүүлэхэд тусалдаг. Цагаан зай нь шинэлэг санаа, шинэлэг байдал, заримдаа дэгжин чамин байдлыг илэрхийлэх арга зам болж чадна.

Зөвлөгөө: Вэб дизайныг хэрхэн энгийн бөгөөд танил дасал болгох.

Зургийн эх сурвалж: Flock Knitwear

Шалтгаан #5: Амьсгалах орон зай, тэнцвэрийг бий болгоход тусалдаг

Тэнцвэртэй дизайн гэдэг нь тэгш хэмтэй байна гэсэн үг биш. Том хэмжээтэй дизайны элементийг хэд хэдэн жижиг элементээр тэнцвэржүүлж болно. Цагаан зай нэмэх нь хуудсан дээрх өөр өөр хэмжээтэй дизайны элементүүдийг тэнцвэржүүлэх гайхалтай арга юм. Хэрэглэгчийн нүд ийш тийш үсчихгүй байхаар урсгалыг бий болго. Сайн дизайн нь зочныг төөрөгдүүлэлгүйгээр нэг цэгээс нөгөө цэг рүү чиглүүлж чаддаг байх ёстой.

Дүгнэлт

Дараагийн удаа та ямар нэгэн вэбсайтаар зочилж, хэсэг хугацаанд саатаж байгаагаа анзаарвал таныг юу тэгж тогтоон, уншуулсныг бодоод үзээрэй. Мөр хоорондын зай нь нийтлэлийг уншихад илүү хялбар болгосон гэж бодож байна уу? Энэхүү туршлага нь танд дахин дахин зочлох сэдлийг төрүүлж байна уу? Навигац цэсийг хайж олоход хүндрэлтэй байсан уу?

Вэбсайт дээр цагаан зайг хэрхэн сайн ашигласныг анхаараарай. Хэрэв энэ нь таны вэбсайтад ч бас тохирохоор байвал өөрийн хүссэн “урсгал”-ыг алдагдуулахгүйгээр зөв өнгө аяс, уншигдахуйц байдлыг бий болгож чадлаа гэж үзэх хүртлээ элементүүддээ хэр их зай хуваарилахаа сурч, зохицуулаарай.

Аливаа вэбсайтын эцсийн зорилго бол харилцаа холбоо юм. Харагдах үзэмж сайтай байх нь танай вэбсайтын амжилттай салшгүй холбоотой.

10 сар 2, 2026

WordPress.com эсрэг WordPress.org

Хэрэв та вэбсайт бүтээх тал дээр харьцангуй шинэ бол WordPress.com болон WordPress.org-ийн хоорондох томоохон маргааны талаар мэдэхгүй байх магадлал өндөр байна. Тэдгээрийн аль нэг нь байдгийг, эсвэл тус бүрийн давуу болон сул талуудыг ч мэдээгүй байж магадгүй. Тэгвэл WordPress.com болон WordPress.org-ийг ашиглах талаарх энэхүү томоохон маргаан нь юу юм бол? Нөгөөх нь зүгээр л шүүхэд дуудагдахыг хүлээж буй хямд хуулбар юм болов уу?

Үгүй ээ, тийм биш.

Товчхондоо энэхүү маргаан нь энэ хоёр WordPress үйлчилгээний аль нь таны бүтээх гэж буй вэбсайтад илүү тохирох вэ гэсэн асуудал юм. Аль нь ч нөгөөгийнхөө хуулбар биш бөгөөд хоёуланг нь WordPress эзэмшдэг; ердөө нэг нь (.com) хөгжүүлэгч биш хүмүүст илүү ээлтэй хувилбар бол нөгөөх нь (.org) сайтын бүтээх тал дээр .com-той харьцуулахад хамаагүй цөөн хязгаарлалттай байдаг.

“Тэгвэл надад аль нь хэрэгтэйг яаж мэдэх вэ?”

Энэ асуултын хариулт нь таны ирээдүйн вэбсайтын хэрэгцээ шаардлагаас бүрэн хамаарна. Ашиглахад бодитоор “илүү дээр” эсвэл бүр “хамгийн шилдэг” гэсэн цорын ганц WordPress хувилбар гэж байхгүй. Энэ хоёр нь өөрийн гэсэн өвөрмөц онцлогтой бөгөөд давуу болон сул талууд нь тэнцүү байдаг.

WordPress.com: Яагаад, хэзээ сонгох ёстой вэ?

WordPress.com нь таны өмнөөс үндсэн чухал зүйлсийг хариуцдаг бөгөөд ингэснээр та сайтынхаа агуулгад илүү анхаарал хандуулах боломжтой болно. Энэ бол Automattic хэмээх компаниудын нэгдлийн бүрэн удирдаж, хостинг хийдэг сайт бүтээгч юм. Та дээд зэрэглэлийн хостинг, нөөц хуулбар, аюулгүй байдал зэргийг авна. Энэ нь эхнээс нь бүтээх гэж олон цагаар суух шаардлагатай харьцуулахад сайтынхаа агуулга дээр хамаагүй хялбар төвлөрөх боломжийг олгоно гэсэн үг юм.

Гэхдээ WordPress.com нь өөрийн гэсэн хязгаарлалттай гэдгийг анхаарна уу. Та сайтынхаа дотоод ажиллагааг авч явах тал дээр тийм ч их санаа зовох шаардлагагүй ч гэсэн, хүссэн хэмжээгээрээ эрх чөлөөтэй байж чадахгүй байж магадгүй гэдгээ санахад илүүдэхгүй. Сайтынхаа интерфэйсийг өөрчлөн тохируулах нь асуудал биш байж болох ч (жишээлбэл, WordPress.com нь маш олон загвартай ирдэг), залгаас (plugin) хэлбэрээр тодорхой функц болон элементүүдийг нэмэх нь, ялангуяа таны сайтад WordPress.com дээр байхгүй тусгай функцууд шаардлагатай бол хүндрэлтэй байж болно.

Вэбсайтыг хэрхэн авч явах нь цоо өөр асуудал юм. Энэ нь 1.) та WordPress хөгжүүлэгч биш эсэх 2.) код сурах хүсэлгүй эсэх эсвэл 3.) сурах цаг зав бага эсвэл огт байхгүй эсэхээс ихээхэн хамаарна.

WordPress.org: Хэзээ үүнийг сонгох талаар бодох хэрэгтэй вэ?

WordPress.org-ийг сонгох талаар бодож үзэх гол баримтлах дүрэм бол та ядаж кодын ажиллагааны талаар бага зэрэг мэддэг эсвэл код бичихэд суралцахад цаг зав гаргахад бэлэн байх үе юм. WordPress.org нь WordPress-ийн бие даан байршуулдаг хувилбар тул та хүссэнээрээ гардан орж ажиллах боломжтой. Мөн хүссэн хэмжээгээрээ үүнийг өөрчилж, тохируулах бүрэн эрх чөлөөтэй. Та өөрийн хостинг хайж олох, аюулгүй байдлын нөөц хуулбарыг тохируулах болон ерөнхийдөө вэбсайтыг бие даан авч явах, хамгийн чухал нь өөрийн хүссэн нөхцөлөөрөө удирдах үүргийг хүлээнэ.

“Гэхдээ байз даа, би яагаад тэгэхийг хүснэ гэж? WordPress-ийн зорилго нь сайт бүтээхийг илүү хялбар болгох биш билүү?”

…Яг ч тийм биш. Үүнийг ингэж бодоод үз дээ: The Daily Post нь WordPress.org болон WordPress.com-ийн хооронд гайхалтай зүйрлэлийг гаргасан бөгөөд үүнийг хамгийн анхан шатны эхлэн суралцагч ч (жишээ нь, над шиг) шууд ойлгохоор тайлбарласан байна.

Тэдний хэлснээр, WordPress.com-ийг та өөрөө бүрэн эзэмшдэггүй зүйл гэж ойлгох хэрэгтэй. Жишээлбэл, 15 насандаа эцэг эхтэйгээ хамт амьдарч байгаагаар төсөөлөөд үз дээ. Хэрэв та өрөөгөө будахыг хүсвэл эхлээд эцэг эхээсээ зөвшөөрөл авах шаардлагатай (мэдээж тэд таны өрөөг оруулаад байшинг бүхэлд нь бүрэн эзэмшдэг). Техникийн хувьд энэ өрөө таных боловч эцсийн дүндээ, яг үнэндээ тийм биш юм.

Тиймээс хэрэв та ямар нэгэн эрс өөрчлөлт хийх шаардлагатай эсвэл хүсэж байвал (ханаа будах, эсвэл өрөөгөө томруулах гэх мэт) байшингийн жинхэнэ эзэд болох аав, ээжтэйгээ ярилцаж, тохиролцох хэрэгтэй болно. Гэхдээ үүний давуу тал нь подвал дахь гал хамгаалагч шатах эсвэл агааржуулагч ажиллахаа болиход эцэг эх тань үүнийг зохицуулдаг тул та юунд ч санаа зовох хэрэггүй болдог.

Нөгөө талаас, WordPress.org бол та өөрийн дураар чөлөөтэй өөрчлөн тохируулж, оролдож болох зүйл юм. Үүнийг 18 насандаа гэрээсээ нүүж, өөрийн гэсэн байртай болсонтой зүйрлэж болно. Та орон сууцаа бүрэн эзэмшдэг тул ханаа ээжийнхээ үргэлж дургүйцдэг байсан өнгөөр будах гэж хэнтэй ч тохиролцох шаардлагагүй; та шийдвэр гаргах, мөн/эсвэл өөрийн шаардлагад нийцэх хүнийг хөлсөлж хийлгэх эрх чөлөөтэй. Үүнээс гадна та зочны өрөөндөө яг ямар агааржуулагч тавихаа сонгох бүрэн эрхтэй. Харин хэрэв тэр нь эвдэрвэл засварчин хөлслөх, эсвэл юу нь болохоо байсныг олж мэдээд өөрөө засахаас өөр аргагүй (энэ нь тийм ч муу биш, учир нь туршлага хуримтлуулна, суралцах нь сайн зүйл шүү дээ).

Одоо та WordPress.com болон WordPress.org-ийн хоорондох тодорхой ялгааг илүү сайн ойлгосон гэж найдаж байна. Гэхдээ товчхондоо:

хүссэнээрээ их эсвэл бага суулгах загварууд нь зөвхөн WordPress загваруудаар хязгаарлагддаг, зарыг арилгахын тулд тодорхой төлбөр төлөх шаардлагатай.Та өөрийн сайтыг бараг бүрэн хянах боломжтой; та өөрийн загваруудыг нэмэх, өөрчлөх, эсвэл бүр бүтээх боломжтой.

Агуулгын хяналт хязгаарлагдмал;

WordPress.com	WordPress.org
WordPress бүрэн байршуулдаг; бүх чухал шаардлагатай зүйлсийг хангасан.	Өөрөө байршуулдаг; өөрийн чухал зүйлсийг сонгох эсвэл илүү дээр зүйлсийг сонгох боломжтой.
Функцууд нь WordPress.com-ийн санал болгож буйгаар хязгаарлагддаг	Залгаасууд хэлбэрийн мянга мянган функц;

Эдгээр нь хоёр хувилбарын ялгааг харьцуулж үзэхэд гарч ирэх цөөн хэдэн жишээ юм. Энэ хоёрын хооронд сонголт хийх нь эцсийн дүндээ өөрийн сайт бүтээхэд хэр их эрх чөлөө хүсэж байгаа, мөн үүнд хэр их нөөц (цаг хугацаа, хүчин чармайлт, мөнгө г.м.) зориулахад бэлэн байгаагаас шалтгаална. Аль WordPress платформ танд хамгийн сайн тохирохыг шийдэхээсээ өмнө эдгээр нь хоёулаа харгалзан үзэх маш чухал сонголтууд гэдгийг санаарай. Тиймээс шийдвэр гаргах үйл явцдаа бүү яар!

Вэбсайт бүтээх ажилд тань амжилт хүсье!

10 сар 2, 2026

Шорткод буулгалт: PBS хэрхэн 800+ плагин ба 2,000+ шорткодыг дэмжих вэ
When I started getting further into software development and WordPress, I noticed that not a lot of page builders I come across with have that “page builder standard” I was looking for: fast, easy, convenient.

Page Builder Sandwich, then, was created with the goal of having a builder meet these same standards.

I wanted- and still want it– to be the best page builder out there, and the best way I could accomplish that, I figured, was to add in features in a way in which page building becomes helpful and accessible to everyone –developers and noobs alike.

I’d like to note though, that I didn’t simply create PBS with the intent of merely bombarding it with features just for the sake of it.

I want to add in features that people would want to work with; features that hopefully, would make the experience of page building feel a little bit more like magic.

Өнгөрсөн хэдэн долоо хоногт PBS баг газрын зургийн элемент, мөн түүнчлэн таб элемент нэмсэн.

Одоогийн байдлаар хэдхэн хоног тутамд шинэ элемент нэмсээр байх нь бидэнд тун амархан бөгөөд энгийн нэгэн хэвшил шиг санагдах байх.

But I think it’d be better if we take it to the next level; to take a bigger leap, do something more drastic, something drizzled with a little more awesomesauce.

And so we came up with an idea: “How about we start supporting 800+ plugins along with their 2000+ shortcodes?!?!”

I know what you’re thinking: “How the heck can you support that much shortcodes? Is that even possible?”

Well, the simple answer is yes. Yes it is.

And we’ve managed to achieve this feat through shortcode mapping.

What is Shortcode Mapping?

Shortcode mapping makes building shortcodes more friendly.

Put more simply, shortcode mapping is like letting Page Builder Sandwich memorize all the shortcodes available on your site: their names, descriptions, their attributes, and what each of these attributes do.

Ийм системийн давуу талууд нь нэлээд их:

1.) Since PBS already knows what your shortcodes are, you get to spend less time going through the documentation of each plugin you use, and check how to use their shortcodes.

2. ) In other words: Say goodbye to the grueling task of manually typing in your shortcodes!

3.) With shortcode mapping, you can also say goodbye to manually checking post type ID’s. How? PBS can give you a list of all your contact forms through a drop-down list, so instead of looking for ID’s while on admin mode, you can pick from the list we made instead.

4.) You’ll get to use dropdowns, colorpickers, image uploaders, and even number sliders when adjusting shortcode attributes.

5.) Overall faster page building time!

Шорткод буулгах (shortcode mapping) нь шинэ зүйл биш бөгөөд олон тооны хуудас бүтээгчид үүнийг аль хэдийн агуулсан байдаг. Гэхдээ манайх юугаараа өөр вэ?

Шорткод буулгах нь бусад хуудас бүтээгчдэд хэрхэн ажилладаг вэ

Each person/site does their own shortcode mapping.

Other page builders have a dedicated admin page for shortcode mapping. You go inside your admin page, and then their admin page. You put in your shortcode, edit a number of text fields, then hit save. Finally, when you go to your page builder editor, the shortcode is now there in element list.

Энэ хувилбарт шорткод буулгах дарамт нь хэрэглэгч танд үлддэг. Хэрэв та өөрийн бүх шорткодыг бүх аттрибутуудтай нь (мөн өнгө сонгогч болон бусад зүйлстэй нь хамт) бүрэн буулгахыг хүсвэл шорткод бүрийн нарийн ширийн зүйл бүрийг нэг бүрчлэн оруулж өгөх шаардлагатай болно.

What’s more, all your mappings only reside on your site. So when the times comes that you need to work on another site, you’ll have to copy your mappings all over again. Additionally, if and when you install a new plugin that has shortcodes, then you’re going to have to map those too.

Page Builder Sandwich дээр шорткод буулгах нь хэрхэн ажилладаг вэ

Shortcode mappings are shared across all users.

Unlike the norm, shortcode mapping in Page Builder Sandwich is done on a global scale. The most used and popular plugins are gathered first, and all their shortcode mappings are created and updated in a central area. These will then spread out to all users depending on what they have installed. In other words, PBS studies and reviews all the shortcodes you have, including your activated plugins. Afterwards, it gives you the mapping of basically everything you need.

Энэ нь бидэнд олон сайхан давуу талыг олгодог:
1. Maximum coverage. Since we’ll be mapping out the shortcodes of the popular plugins, PBS will be able to support a majority of the shortcodes available on your site.
2. Constant and frequent additions, updates and corrections. And since it’s in a central area, changes can be made quickly, and can be disseminated to all users.
3. It basically works like magic. Let’s say you just installed a new plugin. Then you activate it, all mappings for its shortcodes will automatically get sent to you right away.
4. Gone are the days when you have to personally map shortcodes yourself. PBS will do that for you.
5. Your site remains lean and fast, and will only contain shortcode mappings that are relevant to you.
6. Plugin zip size remains small. Even though PBS supports thousands of shortcodes, the plugin file size is still small. Your site and your backups remain small too!
In case you’re interested in reading into how we made all of this possible, we actually have a second part to this article in which things might start sounding a little more technical (if that’s your drift).

Манай мэдээллийн товхимолд бүртгүүлээрэй!

You can also opt to sign up to our mailing list, which will automatically notify you when we officially release this feature, (you can get future updates from us too, if you want). The shortcode mapping functionality will be out for our customers tentatively on August 12 August 15 2016. Not all shortcodes will be mapped by this time (our estimate is maybe 100 plugins), but mapping will be continuously done and customers will get them as soon as new ones roll out.

So sign up to our newsletter to get news on shortcode mapping, when we’ll release it, and when we open shortcode mapping to the public! Until then, we hope you enjoy this new feature of ours, and that you have fun exploring it!
10 сар 2, 2026
Яагаад WordPress гэж?

Анхны вэбсайтаа бүтээхдээ анхаарах ёстой нэг чухал зүйл бол—та бизнес эрхлэгч, чөлөөт уран бүтээлч эсвэл ерөөс хэн ч байсан хамаагүй—хүн бүр код болон програм хангамж хөгжүүлэлтийн хэлийг сайн мэддэггүй явдал юм. Жишээ нь, та өөрийн жороо онлайнаар нийтлэхийг хүсдэг тогооч байж болно. Эсвэл мэргэжлийн түвшний портфолио хэрэгтэй дүрслэх урлагийн оюутан, эсвэл өөрсдийн вэбсайт хэрэгтэй стартап бизнес байж ч болно. Эдгээрийн аль нь ч байсан хамаагүй, бидний зарим нь кодын анхан шатны мэдлэгтэй байж болох ч бид бүгдээрээ бүтэн цагийн хөгжүүлэгчид биш, мөн вэбсайт хэрэгтэй эсвэл хүссэн хүн бүр үүнийг эхнээс нь дуустал нь яаж хийхийг мэддэггүй гэдэг нь бодит үнэн юм. Энэ үед л WordPress хэрэг болж магадгүй юм. Тэгвэл: “Яагаад WordPress гэж?” гэсэн асуулт гарч ирнэ.

ШАЛТГААН #1

WordPress бол Агуулгын Удирдлагын Систем (CMS) бөгөөд ашиглахад маш хялбар.

Таны мэдэх ёстой хамгийн эхний зүйл бол WordPress нь Агуулгын Удирдлагын Систем (буюу CMS) юм. Энгийн үгээр хэлбэл, энэ нь WordPress нь хэрэглэгчдэдээ эхнээс нь код бичих шаардлагагүйгээр вэбсайт үүсгэх боломжийг олгодог гэсэн үг юм. Энэ нь системтэй, эмх цэгцтэй интерфэйстэй тул кодоор байнга оролдох шаардлагагүйгээр бүх зүйлийг хялбархан хянах боломжийг танд олгоно.

Вэбсайтыг эхнээс нь бичихэд ихэвчлэн дараах байдлаар эхэлдэгтэй харьцуулахад:

Агуулгын Удирдлагын Системийн тусламжтайгаар та иймэрхүү зүйлээс эхлэх боломжтой:

WordPress-ийн удирдлагын (back-end) интерфэйс. CMS-ийн тусламжтайгаар вэбсайт удирдах болон үүсгэх нь илүү хялбар болдог.

Гэхдээ та өөрөөсөө: “WordPress гайхалтай харагдаж байна, гэхдээ миний вэбсайтад хүсэж буй боломжууд байхгүй бол яах вэ?”, эсвэл “хэрэв би газрын зураг, хөгжим тоглуулагч, кэшийн систем эсвэл илүү найдвартай хамгаалалтын систем хүсэж байвал яах вэ?” гэж асууж магадгүй.

…Техникийн хувьд авч үзвэл, WordPress-д таны хүссэн тэрхүү боломж байх магадлал өндөр бөгөөд энэ нь WordPress Плагин (Plugin).

ШАЛТГААН #2

Плагинууд: WordPress бялуун дээрх интоор

Хэрэв та өөрийн сайт дээрээ хүссэн тэрхүү онцгой функц WordPress-д байхгүй байх вий гэж санаа зовж байгаа бол битгий санаа зов: энэ нь лав байгаа.

Плагинууд нь таны WordPress сайтын үйл ажиллагааг нэмэгдүүлэх зорилготой “өргөтгөлүүд” юм. Хэрэв та өөрийн сайтад холбоо барих маягт (contact form) шаардлагатай бизнес эрхлэгч бол WordPress-д энэ боломж өөрөө байдаггүй ч, үүнийг хийж чадах олон тооны плагинууд байдаг гэдгийг анхаарна уу. Мөн WordPress нь нээлттэй эх кодтой учир—хэн ч түүний хөгжүүлэлтэд хувь нэмрээ оруулах боломжтой гэсэн үг—шинэ плагинууд тогтмол хийгддэг. Та хүссэн холбоо барих маягтаа болон бусад зүйлсийг авах боломжтой. Та олон нийтийн сүлжээний товчлуурууд, газрын зураг, тэр ч байтугай сайтынхаа нэмэлт хамгаалалтын арга хэмжээ зэрэг бусад олон боломж, өргөтгөлүүдийг нэмэх бүрэн эрх чөлөөтэй. Одоо энэ үнэхээр гайхалтай сонсогдохгүй байна гэж үү.

Одоогийн байдлаар WordPress-д ийм мянга мянган плагин байгаа бөгөөд тэдгээрийн зарим нь, тухайлбал PBS.

ШАЛТГААН #3

Нээлттэй Эх Код: WordPress Хамт Олон

WordPress бол нээлттэй эх кодтой (Open Source). Энэ нь хэн ч түүний хөгжүүлэлтэд хувь нэмрээ оруулах эрхтэй бөгөөд програм хангамж хөгжүүлэлт, тэр байтугай WordPress-ийн талаар илүү ихийг мэдэхийн тулд түүний суурь кодыг судлах боломжтой гэсэн үг юм. Тэр ч байтугай зөвхөн WordPress-тэй холбоотой бүтээгдэхүүнүүд, тухайлбал плагин болон загварууд (бидний адил!) бүтээх, хөгжүүлэхэд бүхэлдээ зориулагдсан бизнесүүд ч бий.

WordPress нь нээлттэй эх кодтой тул маш олон хэрэглэгчид, хөгжүүлэгчид, тэр ч байтугай дизайнерууд байнга хамтран ажиллаж, WordPress-тэй холбоотой асуудлуудыг шийдвэрлэхэд бие биедээ тусалдаг. Ингэснээр та бодит хүмүүсээс бодит тусламж авч, нэгэн зэрэг бие биенээсээ суралцах боломжтой болно. Энэ бол таны ердийн хэрэглэгчийн үйлчилгээний бараг хийж чаддаггүй зүйл юм.

ШАЛТГААН #4

WordPress бол Найдвартай, Баталгаатай.

CNN, Албан ёсны Star Wars Блог, Time сэтгүүл, тэр байтугай Бейонсе хүртэл бүгд бусад олон хүмүүсийн дунд WordPress ашигладаг вэбсайттай. Эдгээр том нэрс нь зөвхөн WordPress-ийн найдвартай байдлыг батлаад зогсохгүй—Treehouse.com сайтад дурдсанаар интернэт дэх нийт сайтуудын 25 орчим хувийг WordPress ажиллуулдаг байна. Хэдэн сая, мянган вэбсайт байдгийг бодолцвол… 25% гэдэг бол үнэхээр том тоо юм.

ШАЛТГААН #5

Тохируулах Асар Их Боломж!

WordPress-д танд болон таны сайтад зориулсан маш олон загварууд бий. Та үнэгүй, дээд зэрэглэлийн (premium) хувилбаруудаас сонгох, эсвэл бүр өөрөө хийх (эсвэл танд зориулж хийлгэх хэн нэгнийг хөлслөх!) бүрэн эрхтэй.

ШАЛТГААН #6:

Энэ нь Үнэ Төлбөргүй.

Тийм ээ, та зөв уншлаа. Local Development-ээр дамжуулан WordPress нь бүрэн үнэ төлбөргүй бөгөөд та ганц товчлуур дараад л үүнийг компьютертээ суулгах боломжтой. Үүнтэй адилаар, хөгжүүлэгч хөлслөхийн оронд кодын талаарх өөрийн мэдлэгээ ашиглан WordPress хэрхэн ажилладаг талаар илүү ихийг сурч болно (мөн шинэ зүйл сурах нь үргэлж сайн байдаг шүү дээ).

…хэрэв танд WordPress болон сайт бүтээхэд гүнзгий орох цаг зав гарахгүй байх магадлалтай бол, та хэзээд тохиромжтой page builder залгаас авч, манайхыг туршиж үзэх боломжтой.

WordPress-ийн тусламжтайгаар хязгааргүй боломжууд бий гэдгийг санаарай, энэ бүхэн хэрхэн ажилладагийг ойлгоход суут ухаантан байх шаардлагагүй!

WordPress ашиглах нь таны цаг хугацаа, мөнгө, хүчин чармайлтыг маш ихээр хэмнэж чадна. Мөн эдгээр нөөц хомс байгаа үед WordPress сайтууд, тэдгээрийн залгаасууд (PBS шиг!), загварууд, ялангуяа түүний нийгэмлэг нь танд бүрэн тусалж, бүх зүйлийг хамаагүй хялбар болгож чадна гэдгийг санаарай.

Вэбсайт бүтээх ажилд тань амжилт хүсье!

10 сар 2, 2026
Хуудас бүтээгч ашиглахаасаа өмнө бодолцох 3 зүйл

Та энд магадгүй PBS нь вэбсайт бүтээх хамгийн хурдан дөт замуудын нэг байж болох талаар сонссон учраас зочилж байж болох юм. Хуудас бүтээгчид ерөнхийдөө аливааг хялбарчлах зорилготой байдаг хэдий ч WordPress хөгжүүлэлтийн энэ талбарт илүү гүнзгий нэвтрэхээс өмнө анхаарах хэрэгтэй хэд хэдэн зүйл бий.

WordPress-ийг сурах нь: Хуудас бүтээгчийн чухал урьдчилсан нөхцөл

Энэ нь магадгүй энэ жагсаалтын хамгийн тодорхой зүйл боловч хамгийн чухал нь хэвээр байна. Харамсалтай нь Хуудас бүтээгчдийг дангаар нь худалдан авах боломжгүй. Тэдгээр нь WordPress дэх плагинууд хэлбэрээр ирдэг бөгөөд ашиглахын тулд суулгаж, суралцах шаардлагатай. WordPress бол вэбсайт үүсгэх хамгийн хялбар бөгөөд найдвартай аргуудын нэг гэдэгт итгэлтэй байж болно. Бидний амьдарч буй өнөө үед техникийн мэдлэгтэй байхдаа та хэзээ ч харамсахгүй. Мөн WordPress.com болон WordPress.org-ийн хооронд ялгаа байдаг бөгөөд алин нь таны хэрэгцээнд нийцэхийг мэдэх нь цаг хугацааг тань бас хэмнэх болно!

Гэхдээ энэ нийтлэл дэх зарим техникийн нэр томьёоноос бага зэрэг эмээж байвал санаа зовох хэрэггүй. Эхлэхэд тань туслах цөөн хэдэн ашигтай сайтууд бий. Тэдгээрийн зарим нь WordPress Codex, болон Treehouse юм. Эдгээр нь таны хэрэгцээ болон мэдлэгийн түвшнээс хамааран WordPress-ийн зөвлөмжүүд болон вэбсайт бүтээх заавруудыг агуулдаг.

Баттай байхын тулд та эхлээд туршиж үзэхийг хүсэж болох юм

Ирээдүйд харамсахад хүргэж болзошгүй томоохон худалдан авалт хийхээсээ өмнө үнэгүй болон/эсвэл туршилтын хувилбаруудыг туршиж үзэх нь үргэлж зөв санаа байдаг. Аз болоход ихэнх хуудас бүтээгчид үнэгүй/демо хувилбартай ирдэг. Мэдээж бид хуудас бүтээгчдийн талаарх найдвартай тоймуудыг судалж болох бөгөөд бусад сайтууд хуудас бүтээгчдийг харьцуулж дүгнэдэг. Сонголтоо сайтар нягталж үзээрэй!

Нийтлэл болон тоймуудыг уншихаас гадна WordPress-ийн бидний дуртай нэг зүйл бол түүний ард асар том хамт олон байдаг явдал юм. WordPress-ийн бусад хэрэглэгчдэд, ялангуяа тантай адил шинэ хүмүүст туслахад бэлэн хувь хүмүүс, багууд, тэр байтугай бизнесүүд байдаг! Энэхүү хамт олон нь авах өгөхийн харилцаанаас илүүтэйгээр бие биедээ туслах сэтгэлээр ажилладаг.

Дизайн маш их ялгааг бий болгодог

WordPress сонирхогч Донна Фонтено Кавалье чирч буулгадаг хуудас бүтээгчид болон суурь дизайны ач холбогдлын талаар маш зөв санааг дэвшүүлсэн байна. PBS зэрэг чирч буулгадаг бүтээгчид нь таны цагийг ихээхэн хэмнэж чадах ч вэбсайт үүсгэхэд анхан шатны мэдлэг, ядаж гоо зүйн талаар тодорхой хэмжээний ойлголттой байх нь анхаарах ёстой өөр нэг чухал зүйл юм. Нэгэн нөхцөл байдлыг төсөөлөөд үзье – та өөрийн хүссэн гайхалтай хуудас бүтээгчийг гартаа оруулж авлаа гэж бодъё: энэ бол гайхалтай! Гэвч та урлаг, дизайн, функционал тал дээр төдийлөн сайн мэдрэмжгүй хүн байлаа гэж бодъё: өө, яана аа.

Гэсэн ч санаа зовох хэрэггүй. Page Builder Sandwich бол зүгээр нэг хуудас бүтээгч биш; манай баг бусад WordPress хэрэглэгчдэд туслахад үргэлж бэлэн байдаг. Тиймээс хэрэв танд дизайны тал дээр бага зэргийн асуудал тулгарч байгаа бол санаа бүү зовоорой – таныг эхлүүлэхэд туслах олон хэрэгтэй зөвлөгөө бүхий олон нийтлэл PBS блогт бий. Ингэснээр та илүү ихийг хийж, илүү ихийг сурч, бага санаа зовох боломжтой болно.

Хэрэв танд хуудас бүтээгчид болон дээр дурдсан зүйлстэй холбоотой ямар нэгэн асуулт, санал байвал доорх сэтгэгдлийн хэсэгт бидэнд чөлөөтэй бичиж үлдээгээрэй. Бид хэрэглэгчдэдээ туслахдаа үргэлж баяртай байдаг.

Сайтаа амжилттай бүтээхийг хүсье!

10 сар 2, 2026
Вэбсайтаа үзэмжтэй харагдуулах 5 энгийн зөвлөмж

In general, one thing that most people tend to overlook is today’s demand for functional design and aesthetics. While not all of us may be aware of the extent of just how much it matters, the fact remains that design is a very crucial factor towards success—any kind of success– including your website’s. Yes, your content is an important key towards reeling your audience in, but how your site looks will definitely be a determining factor as well.

Вэбсайтынхаа дизайныг сайжруулахын тулд хийж болох зарим үндсэн зөвлөмжүүдийг энд оруулав.

Add high-quality images

oars.com

whitetablecatering.com

You want to add the best quality images on your website that reflect your brand style, but if you don’t have a high-resolution camera or the money to pay a photographer, you can get free stock photos from sources like Pexels and Pixabay. Images should pertain directly to the content of your site. Including images is always better than no images at all.

Зөв өнгө сонгох

Lawrence Boone Selections uses black to add a sense of luxury and value to their website

Juicebox used this zesty combination for people to get that organic and fresh that the brand represents

Вэбсайтын өнгөний зохицол нь таны брэндийн зөв өнгө аяс, уур амьсгалыг бүрдүүлэхэд том үүрэг гүйцэтгэдэг. Зүгээр л гоё өнгө сонгох нь энэ нь зөв өнгө гэсэн үг биш юм. Өнгө бүр өөр өөр мессеж, хариу үйлдлийг илгээдэг. Өнгө бол зочдын хамгийн түрүүнд анзаардаг зүйлсийн нэг бөгөөд энэ нь таны вэбсайтын амжилтад бодитоор нөлөөлж чадна.

Дизайндаа зориулж хамгийн ихдээ хоёроос гурван үндсэн өнгө сонгоорой. Хэрэв танд илүү их өнгө нэмэх шаардлагатай гэж үзвэл үндсэн өнгүүдийнхээ гэгээлэг болон бараан туяаг (tint болон shade) ашиглаж болно. Өнгөний онолд tint нь цагаан өнгөтэй хольж тод, гэгээлэг болгосон өнгө байдаг бол shade нь хар өнгөтэй хольж гэгээг бууруулсан бараан өнгө юм.

Additional Tip: There are great tools such as Adobe Colour CC and Coolors to make picking colors easier.

Хоорондоо тохирох ялгаатай фонтуудыг ашиглах

There are more fonts other than Arial, Georgia and Times New Roman. Google Web Fonts offer a variety of typefaces you can use for free on your site. Just like with choosing colors you can easily over do fonts, so I suggest you do not use more than two typefaces on your website. Most well-designed websites use two typefaces only, one for the headlines and one for the body text.

Хоёр өөр фонтын төрлийг хослуулах нь дизайнеруудын хувьд ч хэцүү байж болно. Та нэг фонтын бүлийн хоёр өөр хэв маягийг хослуулан ашиглаж энгийнээр шийдэж болно. Хэрэв хоёр дахь өөр фонт зайлшгүй шаардлагатай бол эхний фонттойгоо сайн тодорч ялгарах фонтыг сонгоорой. Ихэвчлэн serif (хөлтэй) болон sans-serif (хөлгүй) фонтуудыг хослуулах нь сайн үр дүнтэй байдаг. Өөр нэг чухал зөвлөгөө бол компанийнхаа хэв маягт тохирсон фонт сонгох явдал юм. Та дэлхийн хамгийн гоё харагдах фонттой байж болох ч, буруу нөхцөлд ашиглавал маш муухай харагдаж болно.

Цагаан зайг ашиглан цэвэрхэн байлгах

Whitespace is one of the easiest and most effective ways to create a visually effective website. Your website should look well organized and clutter free, directing users exactly where they need to go. Make sure elements stand out and are grouped together by using whitespace properly.

Гар утсанд тохиромжтой болгох

People are probably going to visit your site at different times using different devices and screen sizes. While content is important, consistency across devices provides a better user-experience for anyone who visits your site. It makes it easier for users to share and link contents on your website to social media platforms on mobile. On top of that, Google prioritizes responsive websites on search results.

Нэмэлт зөвлөгөө: Вэбсайтдаа Page Builder Sandwich ашиглах нь гар утасны хувилбарыг автоматаар идэвхжүүлж, дэлгэцийн хэмжээнд тохируулах болно.

Дүгнэлт

Санаж яваарай: Дизайны хүч чадлыг дутуу үнэлэх нь вэбсайт бүтээхэд гаргаж болох хамгийн муу алдаануудын нэг юм. Мэдээжийн хэрэг та вэбсайтаа загварчлахдаа хэтэрхий их хүчин чармайлт гаргах албагүй ч эдгээр зөвлөмжийг дагаж мөрдөх нь таны сайтыг зочдод ямар нэгэн тааламжгүй сэтгэгдэл төрүүлэхгүй байхад тусална.

10 сар 2, 2026
Хялбар 3 алхмаар үндсэн Hero толгой хэсгийг хэрхэн үүсгэх вэ

When your dream website finally becomes a reality, the first thing you want your audience to know is what your site’s all about. The trick to reel them in is to give them a good but quick summary of your site’s content – and the easiest way to do that is by creating a Hero Header for your page.

Hero Header гэж юу вэ?

The purpose of the Hero Header is to visually communicate with your target audience in the fastest and most efficient way possible. You need to grab their attention quickly, in a way that it says: “Hey, this is my website, and here are the reasons it may be worth your time.”

Typically, hero headers take up most of the space on the page, usually with large text and an equally large background image in order to give your readers a quick but firm-enough grasp as to what your website can offer them.

Өөрийн анхны PBS hero header-ийг хийж эхлэхийн тулд дараах хялбар алхмуудыг дагана уу:

Алхам 1: Багана оруулж, Мөрийн өргөнийг тохируулах

Click 1 Column below the Insert Content tab on the inspector (that thing on the left/sidebar). Make sure your caret (the blinking cursor on the text box) is inside the text box.

Under the Row Properties tab, you may change the background color in order to use it as a guide for the next steps. Change Row Width from Normal to Full-Width: Retained Content Width using the toggle button shown above.

What’s the difference between Normal, Full-Width and Full-Width: Retained Content Width?

Normal – Background, text and other elements are contained within the bounds of your current theme’s row width

Full-Width – Background, text and other elements fill the entire width of your browser window

Full Width: Retained Content Width – Only the background fills the entire width of your browser window. Text and other elements are contained within the bounds of your current theme’s row width

In this layout, Full Width: Retained Content Width is used because the text that will be applied is centered; not full-width.

Алхам 2: Зай (Whitespace) үүсгэхийн тулд захын зайг (margin) тохируулах

Increase the top and bottom margin by hovering the cursor on the arrow pointing to the margin you want to adjust. When the cursor turns into a double-headed arrow, click and drag down to your desired margin height. Its important to put Whitespace (also called Negative Space) between elements in a composition to create flow and help draw focus to the content on the page.

Алхам 3: Текст болон элементийн давхарга бүхий арын дэвсгэр нэмэх

To add a background image with text and element overlays, simply click the Background Image icon under the Row Properties tab, upload your desired background image, and select to apply.

Tip #1: For Premium users, using the Background Image Tint option, helps to provide more contrast for text, buttons or other elements. You can select a tint color and adjust its value by clicking on the Background Color icon. Both icons can be found under Background on the Row Properties tab.

Type in the message for your header. See Text Formatting tab to adjust the style. Choose typefaces that are easy to read and goes well with the background image. Remember to show contrast from the background image.

Зөвлөгөө #2: Брэндийн элементүүдийн хувьд өнгөлөг дэвсгэр зурагтай харшлахгүйн тулд цагаан эсвэл хар өнгийн лого ашиглахыг бодолцоорой.

You can also add buttons by clicking on Button below the Insert Content tab.

Хийсэн ажлаа хадгалахаа бүү мартаарай, ингээд л бүх зүйл бэлэн боллоо!

PBS ашиглан анхны hero header-ээ хийсэнд баяр хүргэе! Хэрэв хийгээгүй байсан ч санаа зовох хэрэггүй; PBS-тэй эхнээс нь эхлэх нь харин ч илүү хялбар байдаг тул тийм ч хэцүү биш байх болно.

Вэбсайт бүтээх ажилд тань амжилт хүсье!

10 сар 2, 2026