আপনি যদি লক্ষ্য করে থাকেন, ওয়ার্ডপ্রেসের অন্যতম মূল নীতি হলো সবার জন্য কাজ সর্বদা, সবসময় কিছুটা সহজ করা—তা সে নতুন ব্যবহারকারী হোক বা অভিজ্ঞ ডেভেলপার। এই লক্ষ্য অর্জনের একটি উপায় হলো শর্টকোডের ব্যবহার।
শুনতে বেশ সহজ লাগছে। এখন, এই নিবন্ধটির আগে আপনি যদি শর্টকোড সম্পর্কে না শুনে থাকেন এবং এগুলো দেখতে কেমন তা না জেনে থাকেন, তবে এগুলো হলো তৃতীয় বন্ধনীতে আবদ্ধ প্রাচীন কোডের মতো দেখতে টেক্সট।
সাধারণ কোড-এর তুলনায়, যা সাধারণত দেখতে এরকম হয়:
(উম। কী?)
শর্টকোড দেখতে কিছুটা এরকম হয়:
(একদম সহজ।)
…এবং আপনি যদি একজন ডেভেলপার হন (বা নিদেনপক্ষে এমন কেউ যিনি কম্পিউটারে কাজ করেছেন), তবে আপনি সম্ভবত একমত হবেন যে একটি সামান্য কাজ সম্পন্ন করতে শুধুমাত্র টাইপ এবং ক্লিক করার প্রক্রিয়াটি আপনার অনেকটা সময় নষ্ট করতে পারে। যে কারণে আমাদের কীবোর্ড শর্টকাট রয়েছে, ঠিক সেই একই কারণে শর্টকোডগুলো আমাদের সবার কাজ সহজ করার জন্য রয়েছে, যাতে আমরা আরও ভালো কিছু করা ও তৈরি করার জন্য সময় বাঁচাতে পারি; এগুলোর উদ্দেশ্য কীবোর্ড শর্টকাট কি-এর মতোই হুবহু এক।
এখন আসুন উপরের এই নির্দিষ্ট শর্টকোডটিতে ফিরে যাই:
নির্দিষ্ট এই কোডটিকে embed shortcode বলা হয় এবং এটি ওয়ার্ডপ্রেসে আগে থেকেই ডিফল্টভাবে যুক্ত থাকে। এটি ইউআরএল থেকে ভিডিওটিকে আপনার কনটেন্টে এম্বেড করে। আপনি যদি এই মুহূর্তে ওয়ার্ডপ্রেসে থাকেন, তবে এটি পরখ করে দেখার জন্য উপরের শর্টকোডটি কপি করে আপনার সাইটে পেস্ট করতে পারেন।
তবে শর্টকোড সময় বাঁচানোর কোনো নিখুঁত সমাধান নয়। আমাদের পূর্ববর্তী নিবন্ধে, আমরা শর্টকোডের অসুবিধাগুলো কী কী এবং সেগুলো সমাধানের জন্য স্যান্ডউইচ টিম কী নিয়ে কাজ করছে, তা গভীরভাবে আলোচনা করেছি।
আপাতত, শর্টকোড নিয়ে নির্দ্বিধায় ঘাঁটাঘাঁটি করুন এবং দেখুন এগুলো আপনার জন্য কী কী করতে পারে।
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 supportthat much shortcodes? Is thatevenpossible?”
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!
শর্টকোড ম্যাপিং অবশ্য নতুন কিছু নয়, এবং বেশ কিছু পেজ বিল্ডারে এটি ইতিমধ্যেই রয়েছে। তবে কোনটি আমাদেরটিকে আলাদা করে তোলে?
অন্যান্য পেজ বিল্ডারে শর্টকোড ম্যাপিং কীভাবে কাজ করে
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.
এটি আমাদের বেশ কিছু চমৎকার সুবিধা দেয়:
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.
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.
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.
Gone are the days when you have to personally map shortcodes yourself. PBS will do that for you.
Your site remains lean and fast, and will only contain shortcode mappings that are relevant to you.
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!
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.
আপনার ওয়েবসাইটের ডিজাইন উন্নত করার জন্য আপনি যা করতে পারেন, সে সম্পর্কে এখানে কিছু মৌলিক পরামর্শ দেওয়া হলো।
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.
Juicebox used this zesty combination for people to get that organic and fresh that the brand represents
একটি ওয়েবসাইটের কালার স্কিম বা রঙের বিন্যাস আপনার ব্র্যান্ডের সঠিক আবহ ও ভাবমূর্তি ফুটিয়ে তুলতে বড় ভূমিকা পালন করে। একটি সুন্দর রং বেছে নেওয়ার মানেই এই নয় যে সেটি সঠিক রং। প্রতিটি রং একটি ভিন্ন বার্তা ও প্রতিক্রিয়া প্রকাশ করে। রং হলো এমন অন্যতম বিষয় যা সাইটের দর্শকরা প্রথমেই লক্ষ্য করেন এবং এটি প্রকৃতপক্ষে আপনার ওয়েবসাইটের সাফল্যকে প্রভাবিত করতে পারে।
আপনার ডিজাইনের জন্য সর্বোচ্চ দুই থেকে তিনটি মূল রং বেছে নিন। যদি আপনার আরও রং যোগ করার প্রয়োজন মনে হয়, তবে আপনি মূল রঙগুলোর টিন্ট এবং শেড ব্যবহার করতে পারেন। কালার থিওরিতে, টিন্ট হলো সাদার সাথে কোনো রঙের মিশ্রণ যা উজ্জ্বলতা বাড়ায়, আর শেড হলো সাদার সাথে কোনো রঙের মিশ্রণ যা উজ্জ্বলতা কমায়।
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 ব্যবহার করলে তা স্বয়ংক্রিয়ভাবে মোবাইল ভিউ সক্রিয় করবে এবং মোবাইলের স্ক্রিন সাইজের সাথে মানিয়ে নেবে।
উপসংহার
মনে রাখবেন: ওয়েবসাইট তৈরির সময় ডিজাইনের গুরুত্বকে অবমূল্যায়ন করা সবচেয়ে বড় ভুলগুলোর একটি। অবশ্যই, ওয়েবসাইট ডিজাইন করার সময় আপনাকে খুব বেশি অতিরিক্ত পরিশ্রম করতে হবে না, তবে এই পরামর্শগুলো মেনে চললেই নিশ্চিত হওয়া যাবে যে আপনার সাইটটি আপনার দর্শকদের মনে কোনো অপ্রীতিকর বা নেতিবাচক অনুভূতি তৈরি করছে না।
সহজ কথায়, হোয়াইটস্পেস বা ফাঁকা জায়গা হলো এর সবচেয়ে প্রাথমিক সংজ্ঞায় একটি কম্পোজিশনের সবগুলো উপাদানের চারপাশে এবং মাঝে খালি রেখে দেওয়া জায়গা। অধিকাংশ ওয়েবসাইট মালিকরা যা ভাবেন, এটি কিন্তু কেবল স্ক্রিনের জায়গা নষ্ট করা নয়। সঠিকভাবে ব্যবহার করা হলে, হোয়াইটস্পেস আসলে একটি পণ্যের প্রচার আরও ভালোভাবে করার সুবিধা প্রদান করতে পারে। এটি ভালো ডিজাইন তৈরির একটি গুরুত্বপূর্ণ চাবিকাঠি এবং এটি একটি ওয়েবসাইটকে সব দিক থেকেই আরও উন্নত করে তোলে।
যদিও হোয়াইটস্পেস নামটি বোঝায় যে স্থানটি সাদা, তবে এটি আক্ষরিক অর্থে সবসময় সাদা হওয়ার প্রয়োজন নেই। হোয়াইটস্পেস আসলে যেকোনো রঙের হতে পারে—এমনকি এতে সূক্ষ্ম কোনো প্যাটার্ন বা টেক্সচারও থাকতে পারে। এটি এমন একটি এলাকা যেখানে আপনি চান না যে মানুষের চোখ নিবদ্ধ হোক। বিকল্পভাবে, একে নেগেটিভ স্পেস
বেসলাইন এবং প্যারাগ্রাফের মধ্যবর্তী হোয়াইটস্পেস প্রকৃতপক্ষে ব্যবহারকারীদের ওয়েবসাইটের সমস্ত কনটেন্ট স্বাচ্ছন্দ্যে পড়তে সাহায্য করে। আপনার ওয়েবসাইটের ছোটখাটো বিবরণ সমন্বয় করা (যেমন লাইন-স্পেসিং/লিডিং বা লেটার-স্পেসিং) পড়া সহজ করার ক্ষেত্রে বিশাল পার্থক্য তৈরি করতে পারে।
লক্ষ্য হলো এমন লেআউট ডিজাইন করা যা চোখের জন্য আরামদায়ক এবং পাঠকদের পড়া চালিয়ে যেতে উৎসাহিত করে।
ছবির উৎস: HP Magic Words
কারণ #২: ইন্টারঅ্যাকশনের গতি বাড়ায়
সত্যি বলতে: ওয়েবসাইট ব্রাউজ করার সময় আপনার অধিকাংশ ভিজিটরের খুঁটিয়ে দেখার মতো যথেষ্ট ধৈর্য থাকে না। একটি ওয়েবসাইট যখন এলোমেলো দেখায়, তখন ব্যবহারকারীরা যা খুঁজছেন তা খুঁজে পেতে বিভ্রান্ত হন।
হোয়াইটস্পেস পুরো পেজ জুড়ে পাঠকের দৃষ্টিকে পরিচালিত করতে সাহায্য করে। মনোযোগ আকর্ষণের জন্য কম উপাদানের প্রতিযোগিতা এবং হোয়াইটস্পেসের সঠিক ব্যবহার ভিজিটরদের গতি মন্থর করে এমন বিভ্রান্তি প্রতিরোধ করতে পারে।
হোয়াইটস্পেস ব্যবহারকারীদের তাদের কোথায় তাকানো উচিত সে সম্পর্কে ভিজ্যুয়াল সংকেত দিতে পারে। সঠিকভাবে ব্যবহার করা হলে, হোয়াইটস্পেস তথ্যকে বিশেষভাবে তুলে ধরতে এবং আপনার ওয়েবসাইটের নির্দিষ্ট একটি এলাকায় মনোযোগ আকর্ষণ করতে সাহায্য করে।
মনে রাখবেন, সবকিছুই যদি চোখে পড়ার মতো হয়, তবে আসলে কোনোকিছুই চোখে পড়ে না।
ছবির উৎস: Pocket Penguins
কারণ #৪: প্রথম ধারণা অত্যন্ত গুরুত্বপূর্ণ
একটি ওয়েবসাইটের রূপ ও অনুভূতির সামগ্রিক পরিবেশ (look and feel) চমৎকার প্রথম ছাপের মূল চাবিকাঠি। ভালো প্রথম ধারণা প্রায়শই পরিদর্শনের সময়কাল দীর্ঘায়িত করে। খুব কম হোয়াইটস্পেস আপনার ওয়েবসাইটকে নিম্নমানের ও অবিশ্বাস্য করে তুলতে পারে। ভিজিটররা সাইট বা ব্র্যান্ডটিকে নির্ভরযোগ্য মনে করবেন না যদি না এটি আকর্ষণীয় দেখায়। পর্যাপ্ত পরিমাণে হোয়াইটস্পেস থাকা আপনার ওয়েবসাইটের জন্য সঠিক রূপরেখা তৈরি করতে সহায়তা করে। হোয়াইটস্পেস বুদ্ধিমত্তা, সতেজতা এবং ক্ষেত্রবিশেষে কমনীয়তা প্রকাশের একটি মাধ্যম হতে পারে।
কারণ #৫: স্বস্তিদায়ক স্থান এবং ভারসাম্য তৈরি করতে সহায়তা করে
ভারসাম্যপূর্ণ ডিজাইনের অর্থ কিন্তু প্রতিসম বা সিমেট্রিক্যাল নয়। একটি বড় ডিজাইন এলিমেন্টকে কয়েকটি ছোট এলিমেন্টের মাধ্যমে ভারসাম্যপূর্ণ করা যেতে পারে। আপনার পেজে বিভিন্ন আকারের ডিজাইন উপাদানের ভারসাম্য বজায় রাখার জন্য হোয়াইটস্পেস যোগ করা একটি দুর্দান্ত উপায়। একটি সাবলীল প্রবাহ তৈরি করুন যাতে ব্যবহারকারীদের দৃষ্টি এদিক-সেদিক এলোমেলোভাবে না ঘোরে। একটি ভালো ডিজাইন ভিজিটরকে বিভ্রান্ত না করে এক বিন্দু থেকে অন্য বিন্দুতে পরিচালিত করতে সক্ষম হওয়া উচিত।
উপসংহার
পরের বার যখন আপনি কোনো ওয়েবসাইট পরিদর্শন করবেন এবং সেখানে কিছুক্ষণ সময় কাটাবেন, তখন ভাবুন কী আপনাকে সেখানে থাকতে এবং পড়তে আগ্রহী করেছিল। আপনি কি মনে করেন যে লাইন-স্পেসিং কোনো প্রবন্ধ পড়া আরও সহজ করে তোলে? এই অভিজ্ঞতা কি আপনাকে আরও তথ্যের জন্য বারবার ফিরে আসতে উৎসাহিত করে? নেভিগেশন খুঁজতে গিয়ে কি আপনার কোনো সমস্যা হয়েছিল?
ওয়েবসাইটে হোয়াইটস্পেসের ভালো প্রয়োগের বিষয়টি লক্ষ্য করুন। আপনি যদি মনে করেন এটি আপনার ওয়েবসাইটেও কার্যকর হতে পারে, তবে আপনার ওয়েবসাইটের জন্য কাঙ্ক্ষিত “প্রবাহ” ব্যাহত না করে যতক্ষণ না আপনি সঠিক সুর ও পঠনযোগ্যতা ফুটিয়ে তুলতে পারছেন, ততক্ষণ পর্যন্ত আপনার উপাদানে কতটা জায়গা বরাদ্দ করবেন তা প্রয়োগ এবং পরিচালনা করতে শিখুন।
যেকোনো ওয়েবসাইটের চূড়ান্ত লক্ষ্য হলো যোগাযোগ স্থাপন। চাক্ষুষ আবেদন আপনার ওয়েবসাইটের সাফল্যের সাথে অঙ্গাঙ্গীভাবে জড়িত।
আপনি এখন Page Builder Sandwich ব্যবহার করে আপনার পৃষ্ঠার নকশায় মানচিত্র যুক্ত করতে পারেন!
মানচিত্র নিয়ে এতটা রোমাঞ্চিত হওয়াটা কিছুটা অদ্ভুত মনে হতে পারে। আপনি কেবল Google Map-এর URL নেন এবং তা এম্বেড করেন। অথবা হয়তো অনলাইন থেকে একটি ম্যাপ প্লাগইন নিয়ে শর্টকোড বসিয়ে দেন। কিংবা আপনার বর্তমান পেজ বিল্ডারে হয়তো ইতিমধ্যে একটি ফিচার রয়েছে এবং আপনি যখন খুশি তা যুক্ত করতে পারেন। কিন্তু আমাদের রোমাঞ্চিত হওয়ার কারণ হলো, আমরা মানচিত্র যুক্ত করার অভিজ্ঞতাকে সম্পূর্ণ নতুন এক মাত্রায় নিয়ে এসেছি।
এখানে একটি প্রিভিউ দেওয়া হলো:
মানচিত্র যুক্ত করার পুরোনো ও একঘেয়ে পদ্ধতি
সাধারণ কোনো পেজ বিল্ডার দিয়ে যেভাবে আপনি একটি মানচিত্র যুক্ত করেন:
আপনি একটি নতুন ম্যাপ উপাদান ড্র্যাগ করেন,
ফিল্ডগুলোতে অক্ষাংশ এবং দ্রাঘিমাংশ প্রবেশ করান,
ফিল্ডগুলোতে অন্যান্য মান যেমন ম্যাপের উচ্চতা, ম্যাপের প্রস্থ ইত্যাদি দেন, রোড স্টাইলের চেকবক্সে টিক চিহ্ন দেন, ইত্যাদি,
প্রিভিউতে ক্লিক করে কেমন দেখাচ্ছে তা যাচাই করেন এবং এটিকে আরও আকর্ষণীয় করার জন্য কিছু পরিবর্তন করার সিদ্ধান্ত নেন,
পুনরায় পেজ বিল্ডারে ফিরে যান এবং মানগুলো পরিবর্তন করেন, তারপর উপরের ৪ নম্বর ধাপের পুনরাবৃত্তি করেন।
Page Builder Sandwich-এ মানচিত্র যুক্ত করার পদ্ধতি
ওয়েবসাইটে মানচিত্রগুলো ইন্টারঅ্যাক্টিভ – আপনি মানচিত্রটি চারদিকে সরাতে পারেন, জুম ইন বা জুম আউট করতে পারেন। তাই আমরা ভাবলাম, অনুমানের ওপর কাজ করার ঝামেলা বাদ দিয়ে পৃষ্ঠা তৈরির সময়েই ব্যবহারকারীদের সরাসরি মানচিত্রের সাথে ইন্টারঅ্যাক্ট করার সুযোগ দিলে কেমন হয়?
Page Builder Sandwich দিয়ে যেভাবে আপনি একটি মানচিত্র যুক্ত করবেন:
আপনি একটি ম্যাপ উপাদান যুক্ত করবেন,
মানচিত্রটি যে স্থানে কেন্দ্র করতে চান তার অক্ষাংশ এবং দ্রাঘিমাংশ বা ঠিকানা টাইপ করবেন,
আপনার পছন্দমতো রূপ পেতে মানচিত্রটি চারপাশে সরাবেন এবং জুম ইন বা জুম আউট করবেন,
আপনার নিজস্ব শৈলীর সাথে মেলাতে মানচিত্রে কিছু চমৎকার রঙ যুক্ত করবেন,
সংরক্ষণ বাটনে চাপ দিন।
আমাদের পদ্ধতিটি অনেক বেশি আনন্দদায়ক এবং সহজবোধ্য। আপনি মূলত একটি সাধারণ Google Map যেভাবে ব্যবহার করেন, ঠিক সেভাবেই এই মানচিত্রের সাথে কাজ করতে পারবেন।
রঙিন মানচিত্র অথবা SnazzyMaps দিয়ে সেগুলোকে সাজানো
আমরা একটি চমৎকার ফিচার যোগ করেছি, যা হলো আপনার মানচিত্রে শেড ও রঙ যুক্ত করার সুবিধা, এবং এটি করা অত্যন্ত সহজ। (এটি কেবল প্রিমিয়াম সংস্করণের জন্য প্রযোজ্য)। আপনি যদি আপনার মানচিত্রকে রঙিন করতে চান, তবে শুধু আমাদের কালার পিকারে ক্লিক করে একটি রঙ বেছে নিন, আর আপনার মানচিত্রটি তাৎক্ষণিকভাবে পরিবর্তিত হয়ে যাবে।
এখানে এমন একটি মানচিত্র রয়েছে যা আমরা গোলাপি রঙে রঙিন করেছি:
Page Builder Sandwich SnazzyMaps-এর মাধ্যমে আরও বৈচিত্র্যময় কালার স্কিমও সমর্থন করে। তাদের কাছে ব্যবহারকারীদের তৈরি কালার স্কিমের এক বিশাল তালিকা রয়েছে এবং রঙের ওপর আরও নিয়ন্ত্রণ চাইলে তারা আপনাকে নিজের মতো করে স্কিম তৈরির সুযোগও দেয়।
শুধু আপনার পছন্দের কালার স্কিমটি খুঁজে নিন, তারপর কোডটি কপি করে Page Builder Sandwich-এ পেস্ট করুন। সাথে সাথেই কালার স্কিমটি আপনার মানচিত্রে প্রয়োগ হয়ে যাবে।
মানচিত্র দিয়ে আপনি আরও অনেক চমৎকার কাজ করতে পারেন – যেমন আরও আকর্ষণীয় রূপ দেওয়ার জন্য এগুলোকে ফুল-উইডথ সারিতে যুক্ত করতে পারেন। আপনি চাইলে ক্যারোসেলের ভেতরে বা ট্যাবের ভেতরেও (একটি আসন্ন ফিচার) এগুলো যুক্ত করতে পারেন।
আপনার কাছে এখনও Page Builder Sandwich না থাকলে, আপনি উপরে থাকা “Live Demo” লিঙ্কে.
ওয়ার্ডপ্রেসের অন্যতম সেরা বৈশিষ্ট্য হলো শর্টকোড। শর্টকোড হলো ডেভেলপার এবং সাইট নির্মাতাদের মধ্যে সংযোগ সেতু, যা ব্যবহারকারীদের তাদের ইচ্ছানুযায়ী প্রায় যেকোনো জায়গায় বিস্তারিত কনটেন্ট যুক্ত করার সুযোগ দেয়। প্লাগইন নির্মাতারা শর্টকোড পছন্দ করেন কারণ এটি তাদের ব্যবহারকারীদের কনটেন্ট কীভাবে এবং কোথায় প্রদর্শিত হবে সে ক্ষেত্রে আরও বেশি নমনীয়তা প্রদান করে।
আপনি যদি শর্টকোড কী এবং সেগুলি দেখতে কেমন তা না জানেন, তবে জেনে রাখুন সেগুলি হলো তৃতীয় বন্ধনীতে (স্কয়ার ব্র্যাকেট) আবদ্ধ প্রাচীন কোডের মতো দেখতে টেক্সট। এগুলি দেখতে অনেকটা এরকম হয়:
এই নির্দিষ্ট শর্টকোডটিকে এম্বেড (embed) শর্টকোড বলা হয় এবং এটি ওয়ার্ডপ্রেসের সাথে ডিফল্টভাবে অন্তর্নির্মিত থাকে। এই নির্দিষ্ট শর্টকোডটি উক্ত ইউআরএল (URL) থেকে ভিডিওটিকে আপনার কনটেন্টে এম্বেড করে দেয়। এটি পরীক্ষা করে দেখতে চাইলে উপরের শর্টকোডটি কপি করে আপনার সাইটে পেস্ট করে দেখতে পারেন।
পেছনের প্রেক্ষাপটে যা ঘটে তা হলো, ওয়ার্ডপ্রেস যখন আপনার কনটেন্টে কোনো শর্টকোড খুঁজে পায়, তখন এটি প্রক্রিয়াজাত হয় এবং অন্য কিছুতে রূপান্তরিত হয়। আমাদের উপরের উদাহরণের ক্ষেত্রে, যখনই একটি
শর্টকোড সনাক্ত করা হয়, ওয়ার্ডপ্রেস শর্টকোডের ইউআরএলটি নেয় এবং তার কাছে থাকা বেশ কয়েকটি কনটেন্ট সরবরাহকারীর সাথে মিলিয়ে দেখে। যখন একটি উপযুক্ত মিল পাওয়া যায়, তখন এটি সঠিক আইফ্রেম (iframe) এম্বেড কোডটি নিয়ে আসে এবং সেটির পরিবর্তে তা প্রদর্শন করে।
তাহলে এখানে সমস্যাটা কোথায়? এটি তো বেশ সহজ মনে হচ্ছে, আপনি কেবল বন্ধনীসহ একটি ছোট টেক্সট লিখবেন এবং কাজ শেষ।
এবার জানা যাক শর্টকোড এপিআই (Shortcode API) সম্পর্কে..
শর্টকোডের প্রাচুর্য
শর্টকোড এপিআই ডেভেলপারদের জন্য শর্টকোড তৈরির পথ উন্মুক্ত করে দেয়। এর কারণে, ডেভেলপাররা তাদের প্লাগইনের ভেতরে নিজেদের নিজস্ব শর্টকোড যোগ করতে পারেন।
এটি দুর্দান্ত, এখন কেবল একটি সংক্ষিপ্ত কোড-সদৃশ স্নsnippet (যার কারণে নাম “শর্টকোড”) এর সাহায্যে নতুন এবং অভিজ্ঞ উভয় ধরনের ব্যবহারকারীই যেকোনো ধরনের কনটেন্ট তাদের ইচ্ছামতো যেকোনো জায়গায় রাখতে পারেন।
ডিফল্টভাবে ওয়ার্ডপ্রেসে মাত্র কয়েকটি শর্টকোড থাকে। যেহেতু সেগুলির সংখ্যা খুব কম, তাই মুখস্থ করে লিখে ফেলা সহজ। কিন্তু আপনি যদি কয়েকটি প্লাগইন ইনস্টল করেন, তবে শর্টকোডের সংখ্যা দ্রুত এক ডজন বা তার বেশি হয়ে যায়, এবং কিছু ক্ষেত্রে একশোরও বেশি। প্রতিটি শর্টকোডের নিজস্ব অ্যাট্রিবিউট এবং সেগুলি ব্যবহারের নিজস্ব নির্দেশাবলী থাকে। প্রতিটি প্লাগইনের সম্ভবত তাদের সমস্ত শর্টকোড কীভাবে কাজ করে সে সম্পর্কে কিছু ডকুমেন্টেশন থাকে এবং প্রতিটিতে উপলব্ধ সমস্ত প্যারামিটার তালিকাভুক্ত থাকে। কিন্তু আপনি যদি সমস্ত শর্টকোড এবং তাদের অ্যাট্রিবিউট মুখস্থ করার চেষ্টা করেন তবে তা পাগলামি ছাড়া আর কিছুই হবে না।
সমস্যাটি হলো, এমন কোনো কেন্দ্রীভূত স্থান নেই যেখানে আপনি আপনার সাইটে উপলব্ধ সমস্ত শর্টকোড এবং সেগুলি কীভাবে ব্যবহার করতে হয় তা খুঁজে পেতে পারেন।
কেউ কেউ সমস্যা সমাধানের চেষ্টা করেন
কিছু প্লাগইন তাদের নিজস্ব সমস্ত শর্টকোড সহজে ব্যবহারযোগ্য ড্রপডাউনে উপস্থাপন করে এই সমস্যা সমাধানের চেষ্টা করে। তারপর কোনো একটিতে ক্লিক করলেই শর্টকোডটি তার সমস্ত সম্ভাব্য অ্যাট্রিবিউটসহ স্ক্রিনে প্রদর্শিত হয়। আর মুখস্থ করার প্রয়োজন হয় না, যা একটি ভালো দিক।
কেউ কেউ আরও এগিয়ে যান এবং শর্টকোডের অ্যাট্রিবিউট পূরণ করার জন্য চেকবক্স এবং কালার পিকারসহ একটি সেটিংস পপআপ ফর্ম যুক্ত করেন।
এই সমাধানটি মোটামুটি কাজ করে। তবে, প্রতিটি প্লাগইন শুধুমাত্র তাদের নিজস্ব শর্টকোডগুলো তালিকাভুক্ত করে। সুতরাং প্রতিটি প্লাগইন যদি তাদের নিজস্ব শর্টকোড পিকার তৈরি করে, তবে আপনার স্ক্রিনে একাধিক শর্টকোড পিকার দেখা যাওয়ার মতো পরিস্থিতি তৈরি হতে বাধ্য (আমার সাথে আগেও এমনটি ঘটেছে)।
অন্য কথায়, প্রতিটি প্লাগইন নিজেদের মতো করে কাজ করে এবং তাদের নিজস্ব শর্টকোডের জন্য নিজস্ব সমাধান প্রয়োগ করে। কিছু প্লাগইন “Add Media” বোতামের পাশে একটি নতুন বোতাম যুক্ত করে, অথবা TinyMCE-এর ভেতরে একটি নতুন বোতাম যোগ করে।
সুতরাং এখন আপনি হয়তো ভাবতে পারেন, “অন্যান্য প্লাগইনের শর্টকোডগুলোও সংগ্রহ করে কেন আপনার ড্রপডাউন / শর্টকোড পিকারে অন্তর্ভুক্ত করা হচ্ছে না?” আমিও ঠিক তাই ভেবেছিলাম। কিন্তু, বলা যত সহজ করা ততটা সহজ নয়। কেন তা আমি একটু পরেই ব্যাখ্যা করছি, তবে প্রথমে দেখা যাক একটি আদর্শ সমাধান কেমন হতে পারে।
আদর্শ সমাধান
নিখুঁত পরিকল্পনাটি হতো এমন একটি প্লাগইন তৈরি করা যা আপনার সাইটের সমস্ত উপলব্ধ শর্টকোড একত্রিত করবে, তারপর আপনাকে তালিকাটি দেখাবে এবং সমস্ত অ্যাট্রিবিউট পূরণ করতে সহায়তা করবে। এবং প্রতিবার যখনই আপনি একটি নতুন প্লাগইন ইনস্টল করবেন, তখন সেই নতুন যোগ হওয়া সমস্ত শর্টকোডও আপনার সামনে উপস্থাপন করা হবে।
একটি কেন্দ্রীয় স্থানের কথা কল্পনা করুন যেখানে সহজে ব্যবহারের জন্য আপনার সমস্ত শর্টকোড রাখা থাকবে। প্রতিটি শর্টকোড কী কাজ করে এবং এটি কোন প্লাগইনের অন্তর্ভুক্ত তা সেখানে ব্যাখ্যা করা থাকবে। তারপর প্রতিটি উপলব্ধ অ্যাট্রিবিউটের জন্য একটি লেবেল, সেগুলির মান নির্বাচনের একটি উপযুক্ত উপায় এবং একটি বিবরণ থাকবে। আপনাকে ড্রপ ডাউন, কালার পিকার, রেডিও বোতাম, টগল ইত্যাদি দেখানো হবে।
এরকম কিছু ওয়েবসাইট এবং কনটেন্ট নির্মাতা হিসেবে আমাদের জীবনকে আরও সহজ করে তুলবে। আপনি ব্যবহার করতে চান এমন একটি স্লাইডারের জন্য জেনারেট করা শর্টকোড কপি করার জন্য আলাদা আলাদা ডকুমেন্টেশন বা আপনার অ্যাডমিনের বিভিন্ন অংশে খোঁজাখুঁজি করার আর প্রয়োজন হবে না।
বাধা বা সীমাবদ্ধতা
দুর্ভাগ্যবশত, এই মুহূর্তে এরকম কিছু করা বেশ কঠিন। কোনো শর্টকোডের সমস্ত বিবরণ জানার মতো কোনো নিশ্চিত উপায় নেই। আপনি সমস্ত শর্টকোডের একটি তালিকা পেতে পারেন, তবে কেবল তাদের প্রকৃত ট্যাগ/নামগুলো; আপনি সেগুলি সম্পর্কে কোনো অতিরিক্ত বিবরণ পেতে পারবেন না যেমন অ্যাট্রিবিউটের তালিকা, সেগুলি কী করে এবং তাদের ধরণ—যেমন স্ট্রিং, কালার বা কোনো সংখ্যা। এমনকি প্রতিটি অ্যাট্রিবিউটের জন্য সাধারণ কোনো বিবরণও পাওয়া যায় না।
ডেভেলপারদের জন্য নোট: হ্যাঁ, shortcode_atts ফাংশনের জন্য সম্প্রতি একটি তৃতীয় আর্গুমেন্ট যোগ করা হয়েছে, তবে এটি কোনো বাধ্যতামূলক আর্গুমেন্ট নয়। সুতরাং বিশ্বের প্রতিটি প্লাগইন ডেভেলপার যদি এটি প্রয়োগ না করেন, তবে শর্টকোডের সমস্ত অ্যাট্রিবিউট নির্ধারণ করার কোনো নিশ্চিত উপায় আমাদের কাছে থাকবে না।
শর্টকোড এপিআই শর্টকোডের বিবরণ যোগ করা, অ্যাট্রিবিউটের টাইপ কাস্টিং করা বা অ্যাট্রিবিউটের বিবরণ দেওয়ার কোনো সুবিধা প্রদান করে না। এবং ওয়ার্ডপ্রেস নিজে যদি শর্টকোড ব্যবহারের জন্য কোনো কেন্দ্রীয় স্থান যোগ না করে, তবে এই সুবিধাটি তৈরি হবে কিনা তা নিয়ে আমার সন্দেহ আছে।
উপসংহার
এই মুহূর্তে শর্টকোড সাজিয়ে রাখার কাজটি প্রতিটি ডেভেলপারের ওপর নির্ভর করে। ওয়ার্ডপ্রেসের মধ্যে কোনো কেন্দ্রীয় পদ্ধতি তৈরি না হওয়া পর্যন্ত, আপনার ব্যাকএন্ডে একাধিক “Add Shortcode” বোতাম দেখতে পাওয়ার জন্য প্রস্তুত থাকুন। ওয়ার্ডপ্রেস কোরে এমন কিছু যোগ করা উচিত কি না তা নিজেই একটি বিশাল আলোচনার বিষয়।
একটি বিকল্প
কিছু পেজ বিল্ডার প্লাগইন রয়েছে যা এটিকে ভিন্নভাবে সমাধান করে। প্রোগ্রাম্যাটিকভাবে শর্টকোড সনাক্ত করার পরিবর্তে, তাদের শর্টকোড ম্যাপার রয়েছে যেখানে ব্যবহারকারীরা ম্যানুয়ালি শর্টকোডের প্রতিটি বিবরণ ইনপুট করতে পারেন। একবার করা হলে, এটি পেজ বিল্ডারের মধ্যে উপলব্ধ হয়ে যায়। যদিও এটি কাজ করে, তবে সেগুলি কেবল আপনার নিজস্ব সাইটেই সীমাবদ্ধ থাকে।
আমরা এখানে Page Builder Sandwich-এ এমন কিছু তৈরি করছি যা আশা করি এই শর্টকোড সমস্যার সমাধান করতে পারবে। আমাদের অগ্রগতি সম্পর্কে অবহিত হতে নিচে আমাদের নিউজলেটার সাবস্ক্রাইব করুন।
আপনি যদি ওয়েবসাইট তৈরির ক্ষেত্রে তুলনামূলকভাবে নতুন হন, তবে সম্ভবত WordPress.com বনাম WordPress.org-এর তুমুল বিতর্কের সাথে আপনি পরিচিত নন। আপনি হয়তো এটাও জানতেন না যে এদের একটির পাশাপাশি অন্যটিও রয়েছে, এবং প্রতিটির আলাদা সুবিধা ও অসুবিধা রয়েছে। তাহলে দয়া করে বলুন তো, WordPress.com এবং WordPress.org ব্যবহারের মধ্যকার এই বিশাল বিতর্কটি আসলে কী নিয়ে? অন্যটি কি কেবল মামলার মুখে পড়ার অপেক্ষায় থাকা একটি সস্তা নকল?
আসলে, না।
সংক্ষেপে বলতে গেলে, বিতর্কটি হলো আপনি যে ওয়েবসাইটটি তৈরি করার চেষ্টা করছেন তার জন্য এই দুটি ওয়ার্ডপ্রেস পরিষেবার কোনটি বেশি উপযুক্ত। কোনোটিই অন্যটির নকল নয়, এবং দুটি সাইটেরই মালিক ওয়ার্ডপ্রেস; বিষয়টা কেবল এই যে, একটি (.com) সাধারণ ব্যবহারকারীদের জন্য অন্যটির চেয়ে বেশি উপযোগী, এবং .com-এর তুলনায় সাইট তৈরির ক্ষেত্রে .org-এ সীমাবদ্ধতা অনেক কম।
“কিন্তু আমি কীভাবে বুঝব যে আমার কোনটি প্রয়োজন?”
এই প্রশ্নের উত্তর পুরোপুরি নির্ভর করে আপনার ভবিষ্যৎ ওয়েবসাইটের চাহিদার ওপর। কোনো একটি ওয়ার্ডপ্রেস সংস্করণকে নিশ্চিতভাবে ব্যবহারের জন্য “উন্নত” বা এমনকি “সেরা” সংস্করণ বলা যায় না। উভয়েরই নিজস্ব অনন্য বৈশিষ্ট্য রয়েছে এবং সমান পরিমাণ সুবিধা ও অসুবিধা রয়েছে।
WordPress.com: কেন এবং কখন এটি ব্যবহার করা উচিত?
WordPress.com আপনার জন্য প্রাথমিক মৌলিক বিষয়গুলোর খেয়াল রাখে, যা আপনাকে আপনার সাইটের বিষয়বস্তু বা কনটেন্টে আরও বেশি মনোযোগ দিতে সাহায্য করে। এটি এমন একটি সাইট বিল্ডার যা সম্পূর্ণরূপে Automattic নামের একটি কোম্পানি দ্বারা পরিচালিত ও হোস্ট করা হয়। আপনি প্রিমিয়াম হোস্টিং, ব্যাকআপ, নিরাপত্তা এবং এই ধরনের সুবিধাগুলো পাবেন। এর অর্থ হলো একেবারে শুরু থেকে তৈরি করার পেছনে ঘণ্টার পর ঘণ্টা ব্যয় করার বদলে, আপনি অনেক সহজে আপনার সাইটের কনটেন্টের দিকে মনোযোগ দিতে পারেন।
তবে মনে রাখবেন, WordPress.com-এরও কিছু নিজস্ব সীমাবদ্ধতা রয়েছে। যদিও আপনাকে আপনার সাইটের অভ্যন্তরীণ কার্যপদ্ধতি রক্ষণাবেক্ষণ নিয়ে খুব বেশি চিন্তা করতে হবে না, তবুও আপনাকে মনে রাখতে হবে যে আপনি হয়তো নিজের পছন্দমতো পুরো স্বাধীনতা পাবেন না। আপনার সাইটের ইন্টারফেস কাস্টমাইজ করা কোনো সমস্যা নাও হতে পারে (যেমন, WordPress.com-এ প্রচুর থিম থাকে), তবে প্লাগইন আকারে নির্দিষ্ট বৈশিষ্ট্য এবং উপাদান যোগ করা একটি সমস্যা হতে পারে, বিশেষ করে যদি আপনার সাইটে এমন নির্দিষ্ট বৈশিষ্ট্যের প্রয়োজন হয় যা WordPress.com-এ উপলব্ধ নেই।
একটি ওয়েবসাইট কীভাবে রক্ষণাবেক্ষণ করবেন তা সম্পূর্ণ ভিন্ন একটি বিষয়। এটি মূলত নির্ভর করে ১.) আপনি যদি একজন ওয়ার্ডপ্রেস ডেভেলপার না হন ২.) কোডিং শেখার কোনো ইচ্ছে আপনার না থাকে, অথবা ৩.) এর জন্য আপনার কাছে সামান্য বা কোনো সময় না থাকে।
WordPress.org: কখন এটি বিবেচনা করার সময় আসে?
WordPress.org বিবেচনা করার ক্ষেত্রে একটি সাধারণ নিয়ম হলো যখন আপনি কোডের কার্যপ্রণালী সম্পর্কে অন্তত কিছুটা পরিচিত, অথবা এটি কীভাবে কাজ করে তা শেখার জন্য কিছু সময় দিতে ইচ্ছুক। যেহেতু WordPress.org হলো ওয়ার্ডপ্রেসের একটি সেলফ-হোস্টেড সংস্করণ, তাই আপনি নিজের ইচ্ছামতো এতে গভীরভাবে কাজ করতে পারবেন। উপরন্তু, আপনার ইচ্ছানুযায়ী এতে যত খুশি বা যত কম পরিবর্তন করার স্বাধীনতা রয়েছে। আপনাকে নিজের হোস্টিং খুঁজে নেওয়ার, নিজস্ব নিরাপত্তা ব্যাকআপ সেট আপ করার এবং সামগ্রিকভাবে নিজে নিজে ওয়েবসাইট রক্ষণাবেক্ষণ করার দায়িত্ব নিতে হবে—এবং সবচেয়ে গুরুত্বপূর্ণ বিষয় হলো, নিজের শর্তে।
“কিন্তু একটু দাঁড়ান, আমি তা কেন চাইব? ওয়ার্ডপ্রেসের উদ্দেশ্য কি সাইট তৈরি সহজ করা নয়?”
…পুরোপুরি তা নয়। বিষয়টিকে এভাবে ভাবুন: The Daily Post WordPress.org এবং WordPress.com-এর মধ্যে একটি চমৎকার উপমা তুলে ধরেছে, যাতে একেবারেই আনাড়ি কেউও (যেমন আমি নিজে) তৎক্ষণাৎ মূল বিষয়টি বুঝতে পারে।
তাদের মতে, আপনাকে WordPress.com-কে এমন কিছু হিসেবে ভাবতে হবে যার ওপর আপনার পূর্ণ মালিকানা নেই। উদাহরণস্বরূপ, আপনার ১৫ বছর বয়সের কথা ভাবুন, যখন আপনি মা-বাবার সাথে থাকতেন। আপনি যদি আপনার শোবার ঘর রঙ করতে চাইতেন, তবে আপনাকে প্রথমে আপনার মা-বাবার অনুমতি নিতে হতো (যাদের অবশ্যই আপনার ঘরসহ পুরো বাড়ির পূর্ণ মালিকানা রয়েছে)। টেকনিক্যালি ঘরটি আপনার, তবে দিনশেষে, আসলে… এটি পুরোপুরি আপনার নয়।
তাই আপনি যদি কোনো বড় পরিবর্তন করতে চান বা প্রয়োজন হয় (যেমন দেয়াল রঙ করা বা ঘর বড় করা), তবে আপনাকে বাড়ির আসল মালিকদের সাথে অর্থাৎ মা এবং বাবার সাথে কথা বলতে হবে এবং/অথবা একটি সমঝোতায় আসতে হবে। তবে এর একটি ইতিবাচক দিক হলো, যখন বেসমেন্টের ফিউজ নষ্ট হয়ে যায় বা এসি কাজ করা বন্ধ করে দেয়, তখন আপনার মা-বাবা সেটির সমাধান করেন এবং আপনাকে কোনো কিছু নিয়ে ভাবতে হয় না।
অন্যদিকে WordPress.org এমন কিছু যা আপনি নিজের ইচ্ছামতো নির্দ্বিধায় কাস্টমাইজ ও পরিবর্তন করতে পারেন। এটিকে তুলনা করা যেতে পারে ১৮ বছর বয়সে অবশেষে বাড়ি ছেড়ে বেরিয়ে আসা এবং নিজের জন্য একটি ফ্ল্যাট নেওয়ার সাথে। যেহেতু আপনার বাসস্থানের ওপর আপনার পূর্ণ মালিকানা রয়েছে, তাই দেয়াল রঙ করতে গিয়ে আপনার মা সবসময় যে রঙটি অপছন্দ করতেন তা দেওয়ার জন্য আপনাকে কারও সাথে সমঝোতা করতে হবে না; আপনার নিজের সিদ্ধান্ত নেওয়ার এবং/অথবা আপনার মানদণ্ড অনুযায়ী কাউকে দিয়ে কাজটি করিয়ে নেওয়ার স্বাধীনতা রয়েছে। এছাড়াও, আপনার বসার ঘরের জন্য ঠিক কোন এসি ইউনিটটি চান তা বেছে নেওয়ার স্বাধীনতাও আপনার রয়েছে। শুধু এটুকুই যে এটি যদি নষ্ট হয়ে যায়, তবে এটি ঠিক করার জন্য আপনাকে একজন মেকানিক ভাড়া করতে হবে, অথবা সমস্যা কী এবং কীভাবে তা নিজে মেরামত করবেন তা খুঁজে বের করতে হবে (যা খুব খারাপ কিছু নয়, কারণ এতে শিক্ষা হলো, আর শেখা তো ভালো জিনিস)।
আশা করি এতক্ষণে আপনি WordPress.com এবং WordPress.org-এর মধ্যকার সুস্পষ্ট পার্থক্যগুলো সম্পর্কে একটি পরিষ্কার ধারণা পেয়েছেন। তবে সংক্ষেপে:
যত ইচ্ছা বা কম ইনস্টল করুন থিমগুলো কেবল ওয়ার্ডপ্রেস থিমের মধ্যেই সীমাবদ্ধ, বিজ্ঞাপন সরানোর জন্য আপনাকে নির্দিষ্ট ফি দিতে হবে।আপনার সাইটের ওপর আপনার প্রায় সম্পূর্ণ নিয়ন্ত্রণ রয়েছে; আপনি নিজের থিম যোগ করতে, কাস্টমাইজ করতে বা এমনকি তৈরিও করতে পারেন।
কনটেন্ট নিয়ন্ত্রণ সীমিত;
WordPress.com
WordPress.org
সম্পূর্ণরূপে ওয়ার্ডপ্রেস দ্বারা হোস্ট করা; সমস্ত প্রয়োজনীয় বিষয় অন্তর্ভুক্ত।
সেলফ-হোস্টেড; আপনার নিজস্ব প্রয়োজনীয় বিষয় নির্বাচন করুন, বা আরও ভালো বিকল্প বেছে নিন।
বৈশিষ্ট্যগুলো WordPress.com যা অফার করে তার মধ্যেই সীমাবদ্ধ
প্লাগইনের মাধ্যমে হাজার হাজার বৈশিষ্ট্য;
উভয়ের মধ্যকার পার্থক্য বিবেচনার ক্ষেত্রে এগুলো কয়েকটি তুলনা। এই দুটির মধ্যে নির্বাচন শেষ পর্যন্ত নির্ভর করে আপনার সাইট তৈরিতে আপনি কতটা স্বাধীনতা চান এবং এর জন্য আপনি কতটা সম্পদ (সময়, প্রচেষ্টা, অর্থ ইত্যাদি) ব্যয় করতে ইচ্ছুক। মনে রাখবেন, কোন ওয়ার্ডপ্রেস প্ল্যাটফর্মটি আপনার জন্য সবচেয়ে উপযুক্ত তা সিদ্ধান্ত নেওয়ার আগে এ দুটিই অত্যন্ত গুরুত্বপূর্ণ বিষয়। তাই সিদ্ধান্ত নেওয়ার ক্ষেত্রে তাড়াহুড়ো করবেন না!
আপনার প্রথম ওয়েবসাইট তৈরি করার সময় একটি গুরুত্বপূর্ণ বিষয় বিবেচনা করতে হবে—আপনি ব্যবসায়ী, ফ্রিল্যান্সার বা যে কেউই হোন না কেন—তা হলো সবাই কোডিং এবং সফটওয়্যার ডেভেলপমেন্টের ভাষায় পারদর্শী নয়। উদাহরণস্বরূপ, আপনি এমন একজন শেফ হতে পারেন যিনি অনলাইনে তাঁর রেসিপি প্রকাশ করতে চান। আপনি চারুকলার একজন আন্ডারগ্র্যাজুয়েট শিক্ষার্থীও হতে পারেন যার একটি পেশাদার চেহারার পোর্টফোলিও প্রয়োজন, অথবা এমন একটি স্টার্ট-আপ ব্যবসা যার নিজস্ব সাইট দরকার। এটি যেকোনো একটি হোক বা এর মাঝামাঝি কিছু হোক, আসল সত্যটি হলো আমাদের মধ্যে কেউ কেউ হয়তো কোডিংয়ের প্রাথমিক বিষয়গুলির সাথে পরিচিত হতে পারি, কিন্তু আমরা সবাই ফুল-টাইম ডেভেলপার নই, এবং যাদের একটি সাইট প্রয়োজন বা চান তাদের সবাই শুরু থেকে শেষ পর্যন্ত কীভাবে এটি তৈরি করতে হয় তা জানেন না। এখানেই ওয়ার্ডপ্রেস কাজে আসতে পারে। প্রশ্ন আসে: “কেন ওয়ার্ডপ্রেস?”
কারণ #১
ওয়ার্ডপ্রেস একটি কন্টেন্ট ম্যানেজমেন্ট সিস্টেম, যা এটিকে সম্পূর্ণ ব্যবহারকারী-বান্ধব করে তোলে।
প্রথম যে বিষয়টি আপনার জানা দরকার তা হলো ওয়ার্ডপ্রেস একটি কন্টেন্ট ম্যানেজমেন্ট সিস্টেম (বা সিএমএস)। সহজ কথায়, এর অর্থ হলো ওয়ার্ডপ্রেস তার ব্যবহারকারীদের স্ক্র্যাচ থেকে কোড না লিখে ওয়েবসাইট তৈরি করার সুযোগ দেয়। এটিতে একটি নিয়মতান্ত্রিক, সুসংগঠিত ইন্টারফেস রয়েছে যা আপনাকে বারবার কোড নিয়ে ঘাঁটাঘাঁটি না করেই সবকিছু নিয়ন্ত্রণে রাখতে দেয়।
স্ক্র্যাচ থেকে একটি ওয়েবসাইট তৈরি করার সাথে তুলনা করলে, যা সাধারণত এভাবে শুরু হয়:
একটি কন্টেন্ট ম্যানেজমেন্ট সিস্টেমের মাধ্যমে, আপনি এমন কিছু দিয়ে শুরু করতে পারেন:
ওয়ার্ডপ্রেসের ব্যাক-এন্ড ইন্টারফেস। সিএমএস দিয়ে ওয়েবসাইট পরিচালনা এবং তৈরি করা আরও সহজ হয়ে ওঠে।
তবে আপনি নিজেকে প্রশ্ন করতে পারেন: “ওয়ার্ডপ্রেস দুর্দান্ত মনে হচ্ছে, কিন্তু আমার সাইটের জন্য যে বৈশিষ্ট্যগুলি চাই তা যদি এতে না থাকে?”, বা “যদি আমি একটি ম্যাপ, একটি মিউজিক প্লেয়ার, বা একটি ক্যাশিং ইঞ্জিন, বা আরও নির্ভরযোগ্য সুরক্ষা ব্যবস্থা চাই?”
…প্রযুক্তিগতভাবে বলতে গেলে, ওয়ার্ডপ্রেসে সম্ভবত আপনার কাঙ্ক্ষিত বৈশিষ্ট্যটি রয়েছে এবং এটি একটি ওয়ার্ডপ্রেস প্লাগইন.
কারণ #২
প্লাগইন: ওয়ার্ডপ্রেস কেকের ওপরের চেরি
আপনি যদি চিন্তিত হন যে আপনার সাইটে যে নির্দিষ্ট ফিচারটি চান ওয়ার্ডপ্রেসে হয়তো তা নেই, তবে চিন্তা করবেন না: সম্ভবত এটি রয়েছে।
প্লাগইনগুলি হলো “এক্সটেনশন ফিচার” যা আপনার ওয়ার্ডপ্রেস সাইটের কার্যকারিতা বৃদ্ধি করতে উপস্থিত রয়েছে। আপনি যদি এমন একজন উদ্যোক্তা হন যার সাইটের জন্য একটি যোগাযোগ ফর্ম প্রয়োজন, তবে আপনি লক্ষ্য করতে পারেন যে ওয়ার্ডপ্রেসের নিজস্বভাবে এই ফিচারটি নেই, তবে এমন প্রচুর প্লাগইন রয়েছে যাতে এটি আছে। এবং যেহেতু ওয়ার্ডপ্রেস ওপেন-সোর্স—যার অর্থ যে কেউ এর উন্নয়নে অবদান রাখতে পারে—নিয়মিত নতুন প্লাগইন তৈরি করা হচ্ছে। আপনি আপনার পছন্দের কন্টাক্ট ফর্ম এবং আরও অনেক কিছু পেতে পারেন। সোশ্যাল শেয়ারিং বোতাম থেকে শুরু করে ম্যাপ এবং এমনকি আপনার সাইটের জন্য অতিরিক্ত সুরক্ষা ব্যবস্থার পাশাপাশি আরও অনেক অনেক ফিচার এবং এক্সটেনশন যুক্ত করার স্বাধীনতা আপনার রয়েছে। এখন বলুন এটি কি দারুণ শোনাচ্ছে না?
এখন পর্যন্ত, ওয়ার্ডপ্রেসে এই জাতীয় হাজার হাজার প্লাগইন রয়েছে—এবং এর মধ্যে কিছু এমনকি বিনামূল্যে পাওয়া যায় এবং/অথবা বিনামূল্যের সংস্করণ রয়েছে, যার মধ্যে PBS.
কারণ #৩
ওপেন সোর্স: ওয়ার্ডপ্রেস কমিউনিটি
ওয়ার্ডপ্রেস ওপেন সোর্স। এর অর্থ হলো যে কেউ এর উন্নয়নে অবদান রাখতে পারেন, এবং যে কেউ সফটওয়্যার ডেভেলপমেন্ট এবং এমনকি ওয়ার্ডপ্রেস সম্পর্কে আরও জানতে এর ব্যাকবোন কোড অধ্যয়ন করতে পারেন। এমন কিছু ব্যবসাও রয়েছে যা কেবল ওয়ার্ডপ্রেস সম্পর্কিত পণ্য, যেমন প্লাগইন এবং থিম তৈরি এবং বিকাশের জন্য নিবেদিত (আমাদের মতো!)
যেহেতু ওয়ার্ডপ্রেস ওপেন সোর্স, তাই প্রচুর ব্যবহারকারী, ডেভেলপার এবং এমনকি ডিজাইনার রয়েছেন যারা নিয়মিত সহযোগিতা করেন এবং ওয়ার্ডপ্রেস সম্পর্কিত সমস্যায় একে অপরকে সহায়তা করেন। এইভাবে, আপনি আসল মানুষদের কাছ থেকে আসল সাহায্য পান এবং একই সাথে একে অপরের কাছ থেকে শিখতে পারেন। এটি এমন কিছু যা আপনার সাধারণ গ্রাহক সেবা পরিষেবাগুলি খুব কমই করে থাকে।
কারণ #৪
ওয়ার্ডপ্রেস বিশ্বস্ত ও বৈধ।
সিএনএন, দ্য অফিসিয়াল স্টার ওয়ার্স ব্লগ, টাইম ম্যাগাজিন এবং এমনকি (আশ্চর্য!) বিয়ন্সের ওয়ার্ডপ্রেস চালিত সাইট রয়েছে, আরও অনেকের মধ্যে। এই বড় নামগুলিই ওয়ার্ডপ্রেসের বৈধতার একমাত্র প্রমাণ নয়—Treehouse.com-এর মতে, ওয়েবের সমস্ত সাইটের প্রায় ২৫% ওয়ার্ডপ্রেস দ্বারা চালিত হয়। কত লক্ষ কোটি ওয়েবসাইট বিদ্যমান তা বিবেচনা করলে… ২৫% একটি বিশাল সংখ্যা।
কারণ #৫
প্রচুর কাস্টমাইজেশন সুবিধা!
ওয়ার্ডপ্রেসে আপনার এবং আপনার সাইটের জন্য প্রচুর থিম উপলব্ধ রয়েছে। আপনি বিনামূল্যের সংস্করণ, প্রিমিয়াম সংস্করণগুলি থেকে বেছে নিতে পারেন, অথবা এমনকি নিজের মতো করে একটি তৈরি করতে পারেন (বা আপনার জন্য এটি তৈরি করতে কাউকে নিয়োগ করতে পারেন!)।
কারণ #৬:
এটি সম্পূর্ণ বিনামূল্যে।
হ্যাঁ, আপনি ঠিকই পড়েছেন। লোকাল ডেভেলপমেন্টের মাধ্যমে ওয়ার্ডপ্রেস সম্পূর্ণ বিনামূল্যে ব্যবহার করা যায় এবং একটি মাত্র বোতামে ক্লিক করেই এটি আপনার কম্পিউটারে ইনস্টল করতে পারবেন। একইভাবে, একজন ডেভেলপার নিয়োগ করার পরিবর্তে, ওয়ার্ডপ্রেস কীভাবে কাজ করে তা আরও ভালোভাবে জানতে কোডিং সংক্রান্ত আপনার যেকোনো জ্ঞান কাজে লাগাতে পারেন (আর নতুন কিছু শেখা তো সবসময়ই ভালো)।
…তাছাড়া যদি ওয়ার্ডপ্রেস এবং ওয়েবসাইট তৈরির গভীরে যাওয়ার মতো পর্যাপ্ত সময় আপনার না থাকে, তবে আপনি সবসময় একটি চমৎকার পেজ বিল্ডার প্লাগইন ব্যবহার করতে পারেন এবং আমাদেরটিও পরখ করে দেখতে পারেন।
মনে রাখবেন, ওয়ার্ডপ্রেসের মাধ্যমে অফুরন্ত সম্ভাবনা রয়েছে, এবং এটি কীভাবে কাজ করে তা বোঝার জন্য জিনিয়াস হওয়ার কোনো প্রয়োজন নেই!
ওয়ার্ডপ্রেস ব্যবহার করলে আপনার প্রচুর সময়, অর্থ এবং শ্রম বাঁচতে পারে। আর যখন এই সংস্থানগুলোর টানাপোড়েন থাকে, তখন মনে রাখবেন ওয়ার্ডপ্রেস সাইট, এর প্লাগইনগুলো (যেমন PBS!), থিমগুলো এবং বিশেষ করে এর কমিউনিটি আপনাকে সাহায্য করতে এবং আপনার কাজকে অনেক বেশি সহজ করে তুলতে সবসময় পাশে রয়েছে।
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.
হিরো হেডার কী?
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.
আপনার জীবনের প্রথম পিবিএস হিরো হেডার তৈরি শুরু করতে, নিচের সহজ ধাপগুলো অনুসরণ করুন:
ধাপ ১: কলাম যোগ করুন এবং সারির প্রস্থ সামঞ্জস্য করুন
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 betweenNormal, Full-WidthandFull-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.
ধাপ ২: ফাঁকা জায়গা তৈরি করতে মার্জিন সামঞ্জস্য করুন
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.
ধাপ ৩: টেক্সট এবং এলিমেন্ট ওভারলে সহ ব্যাকগ্রাউন্ড যুক্ত করুন
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.
পরামর্শ #২: ব্র্যান্ডিংয়ের উপাদানের ক্ষেত্রে, একটি সাদা বা কালো লোগো ব্যবহার করার কথা বিবেচনা করুন যাতে এটি রঙিন ব্যাকগ্রাউন্ড ছবির সাথে বেমানান না দেখায়।
You can also add buttons by clicking on Button below the Insert Content tab.
আপনার কাজ সেভ করতে ভুলবেন না এবং আপনি সম্পূর্ণ প্রস্তুত!
পিবিএস দিয়ে আপনার প্রথম হিরো হেডার তৈরি করার জন্য অভিনন্দন! তবে আপনি যদি তা না-ও করতে পারেন, উদ্বেগের কোনো কারণ নেই; পিবিএস দিয়ে একদম শুরু থেকে কাজ করা তুলনামূলকভাবে সহজ, তাই খুব বেশি অসুবিধা হওয়ার কথা নয়।
এমন একটি সম্ভাবনা রয়েছে যে আপনি এখানে এসেছেন কারণ আপনি শুনেছেন যে PBS সম্ভবত সাইট তৈরির দ্রুততম শর্টকাটগুলির মধ্যে একটি। সাধারণত কাজ সহজ করার জন্যই পেজ বিল্ডারের অস্তিত্ব, তবুও ওয়ার্ডপ্রেস ডেভেলপমেন্টের এই নির্দিষ্ট ক্ষেত্রে গভীরভাবে প্রবেশ করার আগে কয়েকটি বিষয় আপনার বিবেচনায় নেওয়া উচিত।
ওয়ার্ডপ্রেস শেখা: পেজ বিল্ডারের জন্য একটি অত্যন্ত গুরুত্বপূর্ণ পূর্বশর্ত
তবে, এই আর্টিকেলে উল্লেখিত কিছু কারিগরি শব্দের আধিক্যে আপনি যদি কিছুটা দ্বিধাগ্রস্ত বোধ করেন, তবে চিন্তার কিছু নেই। আপনাকে শুরু করতে সাহায্য করার জন্য কিছু সহায়ক সাইট রয়েছে যেখানে আপনি ভিজিট করতে পারেন। এগুলোর মধ্যে কয়েকটি হলো WordPress Codex এবং Treehouse. আপনার প্রয়োজন এবং জ্ঞানের স্তরের ওপর ভিত্তি করে এখানে ওয়ার্ডপ্রেসের নানা টিপস এবং ওয়েবসাইট তৈরির গাইড রয়েছে।
নিশ্চিত হওয়ার জন্য আপনি প্রথমে যাচাই করে দেখতে চাইতে পারেন
ভবিষ্যতে যাতে আফসোস করতে না হয়, সেজন্য বড় কোনো কেনাকাটা করার আগে ফ্রি এবং/বা ট্রায়াল সংস্করণ ব্যবহার করে দেখা সবসময়ই একটি ভালো সিদ্ধান্ত। সৌভাগ্যবশত, বেশিরভাগ পেজ বিল্ডারই ফ্রি/ডেমো সংস্করণ সহ আসে। অবশ্যই, আমরা পেজ বিল্ডার সম্পর্কে প্রচুর নির্ভরযোগ্য রিভিউ দেখতে পারি, অন্যদিকে অন্যরা পেজ বিল্ডারগুলোর মধ্যে তুলনা ও পার্থক্য তুলে ধরে। আপনার বিকল্পগুলো সতর্কতার সাথে বিবেচনা করতে ভুলবেন না!
আর্টিকেল এবং রিভিউ দেখার পাশাপাশি, ওয়ার্ডপ্রেসের যে বিষয়টি আমরা পছন্দ করি তা হলো এর পেছনে একটি বিশাল কমিউনিটি রয়েছে। এখানে এমন অনেক ব্যক্তি, দল এবং এমনকি ব্যবসা প্রতিষ্ঠান রয়েছে যারা তাদের সহকর্মী ওয়ার্ডপ্রেস ব্যবহারকারীদের, বিশেষ করে আপনার মতো নতুনদের সাহায্যের হাত বাড়িয়ে দিতে সদা প্রস্তুত! কমিউনিটিটি মূলত পারস্পরিক দেওয়া-নেওয়ার চেয়ে নিঃস্বার্থ সহযোগিতার ভিত্তিতে কাজ করে।
ডিজাইন একটি বিশাল পার্থক্য তৈরি করে
ওয়ার্ডপ্রেস উৎসাহী ডোনা ফন্টেনট ক্যাভালিয়ার একটি খুব চমৎকার যুক্তি উপস্থাপন করেছেন ড্র্যাগ অ্যান্ড ড্রপ পেজ বিল্ডার এবং মৌলিক ডিজাইনের গুরুত্ব সম্পর্কে। পিবিএস-এর মতো ড্র্যাগ-অ্যান্ড-ড্রপ বিল্ডারগুলো আপনার অনেক সময় বাঁচাতে পারলেও, ওয়েবসাইট তৈরির সময় প্রাথমিক জ্ঞান এবং নান্দনিকতা সম্পর্কে অন্তত কিছুটা পরিচিতি থাকা আরেকটি গুরুত্বপূর্ণ বিষয়। একটি পরিস্থিতির কথা ভাবুন– ধরুন আপনি আপনার পছন্দের একটি চমৎকার পেজ বিল্ডার হাতে পেয়েছেন: দারুণ ব্যাপার! কিন্তু ধরুন আপনি এমন একজন ব্যক্তি যার শিল্প, ডিজাইন এবং কার্যকারিতা বোঝার সঠিক চোখ নেই: তাহলেই মুশকিল.
তবে চিন্তা করবেন না। পেজ বিল্ডার স্যান্ডউইচ শুধুমাত্র একটি পেজ বিল্ডারই নয়; আমাদের টিম অন্যান্য ওয়ার্ডপ্রেস ব্যবহারকারীদেরও সাহায্য করার জন্য নিবেদিত। তাই আপনি যদি ডিজাইন সংক্রান্ত কোনো সমস্যায় পড়েন, তবে চিন্তা করবেন না– আপনাকে শুরু করতে সাহায্য করার জন্য পিবিএস ব্লগে প্রচুর দরকারী টিপস সম্বলিত অনেক আর্টিকেল রয়েছে। এর ফলে আপনি আরও বেশি কাজ করতে পারবেন, বেশি শিখতে পারবেন এবং চিন্তা কম করতে পারবেন।
মনে রাখবেন, পেজ বিল্ডার বা উপরের বিষয়গুলো সম্পর্কিত কোনো প্রশ্ন বা উদ্বেগ থাকলে নির্দ্বিধায় নিচের কমেন্ট সেকশনে আমাদের জানাতে পারেন। আমাদের গ্রাহকদের সাহায্য করতে আমরা সবসময়ই আনন্দিত।