Favicon কি ? কিভাবে Favicon ব্যবহার করবো ?
Favicon
ওয়েব ব্রাউজারে এ্যাড্রেসবারে যেখানে আপনার ওয়েবসাইটের নাম দেখায় ওখানে লক্ষ্য করলে দেখতে পারবেন একটা আইকন দেখায় মূলত এটাই ফেবআইকন ।
কিভাবে Favicon ব্যবহার করবো ?
অনলাইনে Favicon লিখে সার্চ করে ডাউনলোড করে নিতে পারেন । অথবা নিজের পছন্দ মত বানিয়ে ব্যবহার করতে পারেন । যেমন আমাদের সাইটের নামের সাথে মিল রেখে আমরা একটা সিম্পল ভাবে বানিয়ে নিয়েছি ।
ইমেজ সাইজ ৫১২ ☓ ৫১২ সেই সাথে রেজুলেশন ৭২ করে নিন এবং ইমেজটি Png ফরম্যাটে সেভ করে ব্যহহার করুন । যারা ব্লগার উইজার তারা মেনুয়ালি আপলোড করে বা থিমের মধ্যে কাস্টম কোড দিয়ে ব্যবহার করতে পারবেন । আমার মতে থিমের সেটিংস থেকে মেনুয়ালি ব্যবহার করাই ভালো অযথা সময় নস্ট হবে না । আমি দুটি মেথডই দেখিয়ে দিচ্ছি আপনার যেটি ভালো মনে হয়ে করবেন । দুটোতেই কাজ হবে ।
সেটিংস থেকে করতে -
কিছু বুঝতে সমস্যা হলে একটু কষ্ট করে নিচের কমেন্ট অপশনে কমেন্ট করুন রিপ্লেতে আপনার সমস্যার সমাধান করে দেওয়া হবে ।
থিমের মধ্যে কাস্টম কোড দিয়ে ব্যবহার করতে -
প্রথমে আপনার থিমের সেটিংস অপশনে যাবেন এবার Edit HTML এখানে ক্লিক করতে হবে ।
এবার CTRL + F চাপুন <head> লিখে সার্চ করুন , এখন নিচে দেওয়া কোড কপি করে <head> এর নিচের অংশে পেস্ট করে দিন ।<!-- Meta Image -->
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='Your-Logo.png' property='og:image'/>
</b:if>
</b:if>
<b:if cond='data:view.isMultipleItems'>
<meta content='Your-Logo.png' name='twitter:image'/>
<b:else/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image'/>
</b:if>
<b:if cond='data:view.isPost'>
<link expr:href='resizeImage(data:blog.postImageUrl, 700)' rel='image_src'/>
</b:if>
<!-- Meta Icon -->
<link expr:href='data:blog.homepageUrl + "/favicon.ico"' rel='icon' type='image/x-icon'/>
<link href='Your-Logo.png' rel='apple-touch-icon'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='57x57'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='72x72'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='76x76'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='114x114'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='120x120'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='144x144'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='152x152'/>
<link href='Your-Logo.png' rel='apple-touch-icon' sizes='180x180'/>
লাল রং দেওয়া Your-Logo.png যেখানে আছে ওখানে আপনার লোগো ইমেজ লিংক ব্যবহার করবেন ।
