আপনি কী কখনো আপনার ওয়ার্ডপ্রেস ওয়েবসাইটের ফন্টগুলো পরিবর্তন করতে চেয়েছেন? কাস্টমাইজারের সাথে একটি নতুন ফন্ট বেছে নেওয়া কঠিন নয়। চ্যালেঞ্জ আসে যখন আপনি একটি ফন্ট ব্যবহার করতে চান যা থিমের সাথে আসে না বা যেই এলিমেন্টটি আপনি পরিবর্তন করতে চান সেটির জন্য কোনো অপশন নেই।
কাস্টমাইজেবল ফন্টগুলো পরিবর্তন করুন
আরও ফন্ট পেতে, প্রথমে Easy Google Fonts প্লাগইন আপনার সাইটে ইনস্টল করুন।
১. "Plugins -> Add New"-এ যান।
২. "Easy Google Font" সার্চ করুন।
৩. Install এবং তারপর Activate ক্লিক করুন।
৪. এখন আপনার সাইটে আরও ফন্ট অপশন আছে। সেগুলো পরিবর্তন করতে, আপনার কাস্টমাইজারে যান (Appearance -> Customize)।
৫. "Typography -> Theme typography"-এ ক্লিক করুন।
৬. ড্রপডাউন এরোতে ক্লিক করুন এবং নিচে স্ক্রল করুন। আপনি অনেক বেশি উপলব্ধ ফন্ট দেখতে পাবেন।
৭. আপনি যে ফন্টটি ব্যবহার করতে চান সেটিতে ক্লিক করুন।
প্লাগইন ব্যবহার করে আপনার থিমে ইতিমধ্যে কাস্টমাইজেবল টেক্সট পরিবর্তন করা খুব সহজ। হতাশা আসে যখন আপনি একটি নির্দিষ্ট টেক্সট টুকরোর ফন্ট ভিন্ন করতে চান, এবং সেটি করার কোনো জায়গা নেই!
সেসব কাস্টমাইজ করতে আপনাকে ওয়েবসাইটের সেই অংশের CSS কোড পরিবর্তন করতে হবে। যাইহোক, সেটি লুকানো থাকে, তাই আপনাকে সেটি ট্র্যাক ডাউন করতে হবে।
এক্সটেনশনগুলো পান
গুগল ক্রোম ব্রাউজারে, WhatFont নামে একটি এক্সটেনশন সার্চ করুন, এবং তারপর ইনস্টল করুন এবং এটিকে রান করার অনুমতি দিন।
ইনেবল হলে, WhatFont যেকোনো ওয়েবসাইটে পাওয়া যেকোনো ফন্ট শনাক্ত করে। তাই আপনি যদি একটি ফন্ট পছন্দ করেন এবং আপনার কাজে ব্যবহার করতে চান, WhatFont চলাকালীন টেক্সটের ওপর মাউস হোভার করুন, এবং এটি আপনাকে ফন্টের নাম দেখাবে।
আপনার যা পরবর্তী এক্সটেনশন ইনস্টল ও এক্টিভেট করতে হবে সেটি হলো Firebug Lite। এটি আপনার সাইট কোড ডিসপ্লে করে এবং CSS প্রোপার্টি লাইভ এডিট করতে দেয়। এই এক্সটেনশন কোডে টেক্সটের লোকেশন খুঁজে বের করে ফন্ট পরিবর্তন করা সহজ করে দেয়।
ফন্ট খুঁজে বের করুন
আপনার থিম বর্তমানে যে ফন্ট ব্যবহার করছে তার নাম জানতে:
১. WhatFont-কে এর আইকনে ক্লিক করে এক্টিভেট করুন
২. আপনি যে ফন্ট শনাক্ত করতে চান সেটির ওপর হোভার করুন।
৩. ফন্টের নাম নোট করুন।
৪. WhatFont বন্ধ করুন।
পরবর্তী ধাপ হচ্ছে সেই ফন্টের সাথে CSS কোডে লোকেট করা।
১. আগের মতো কাস্টমাইজার খুলুন।
২. Firebug Lite খুলুন (বাগের আইকন যাতে স্ক্রুড্রাইভার)।
৩. Firebug এক্টিভেট করলে, সাইটের কোড স্ক্রিনের নিচে ডিসপ্লে হবে।
আপনাকে এই কোডের সাথে খুব সতর্ক হয়ে কাজ করতে হবে, বিশেষ করে আপনি CSS-এ এক্সপার্ট না হলে। আপনি নির্দেশনা ভালোভাবে ফলো করলে, সাইট ধ্বংস না করে সহজে ফন্টগুলো পরিবর্তন করতে পারবেন। এগিয়ে যাওয়ার আগে আপনার সাইট ব্যাকআপ নেওয়া ভালো ধারণা।
আপনি যে টেক্সট পরিবর্তন করতে চান সেটির বর্তমান ফন্ট খুঁজে বের করুন।
১. CSS-এ ক্লিক করুন।
২. style.css ফাইলটি বেছে নিন। (এটি একটি লম্বা ফাইল।)
৩. Ctrl + f চাপুন এবং সার্চ বক্সে আপনি যে ফন্টের নাম লিখেছিলেন সেটি টাইপ করুন।
৪. এই উদাহরণে আমি Helvetica খুঁজছিলাম, এবং আপনি স্টাইলস CSS-এ সেই ফন্টের লোকেশন কমলা রঙে দেখতে পাচ্ছেন।
৪. ফন্টের লোকেশন হাইলাইট করে কপি করুন। আমি উপরের ছবিতে হলুদ রঙে হাইলাইট করলাম। যদি একাধিক লোকেশন লিস্ট করা থাকে, তবে শুধু একটি কপি করুন।
একটি ফন্ট কন্ট্রোল তৈরি করুন
ফন্ট কন্ট্রোল প্লাগইনকে বলে দেয় CSS-এ কোথায় আমরা যে ফন্ট পরিবর্তন করতে চাই সেটি ব্যবহার হয়েছে। এই ধাপটি কিছুটা ট্রায়াল অ্যান্ড এরর (trial and error) হতে পারে, বিশেষ করে যদি আপনি যে ফন্ট খুঁজছেন সেটি আপনার সাইটের кільটি আলাদা জায়গায় থাকে।
১. আপনার অ্যাডমিন প্যানেলে ফিরে যান, Settings-এ হোভার করুন, এবং Google Fonts-এ ক্লিক করুন।
২. "Create a new font control"-এ ক্লিক করুন।
৩. নতুন ফন্টের লোকেশন বর্ণনা করার জন্য এটি রিনেম করুন।
৪. CSS সিলেক্টর বক্সে CSS লিস্ট থেকে কপি করা লোকেশনটি পেস্ট করুন।
৫. Force Styles override বক্সটি চেক করুন।
৬. Save করুন।
চেক করুন
আপনার কাস্টমাইজারে ফিরে যান এবং সেটি খুঁজে বের করুন যেখানে আপনি ফন্ট পরিবর্তন করতে চান। আপনি যে ফন্ট কন্ট্রোল তৈরি করেছেন সেটির ড্রপডাউন বক্স খুঁজে বের করুন। এটিকে পুল ডাউন করুন এবং আপনি যে ফন্ট ব্যবহার করতে চান সেটি সিলেক্ট করুন। যদি সফল হয়, ফন্ট ক্লিক করতেই পরিবর্তন হয়ে যাবে।
যদি কাজ না করে, ফন্ট কন্ট্রোলগুলোর মধ্যে ফিরে যান, আপনি যে লোকেশন পেস্ট করেছিলেন সেটি ডিলিট করুন, এবং আপনার CSS-এ আসল ফন্ট যেখানে লিস্ট করা ছিল সেখানে অন্য একটি লোকেশন ব্যবহার করে আবার চেষ্টা করুন। মনে রাখবেন, এটি কাজ করতে কয়েকবার চেষ্টা লাগতে পারে।
আপনি যদি একটি সাধারণ থিম ব্যবহার করেন, তবুও আপনার ওয়ার্ডপ্রেস থিমে যেকোনো ফন্ট পরিবর্তন করার ক্ষমতা আপনার সাইটকে একটি অনন্য লুক দেবে। নিশ্চিত করুন আপনার সাইট সঠিকভাবে আপডেটেড, এবং এটা ট্রাই করুন।
