TechBlogSD - ওয়ার্ডপ্রেস এবং ওয়েব ডেভেলপমেন্টের জন্য সবকিছু
ওয়েব এবং ওয়ার্ডপ্রেস নির্দেশাবলী, খবর, থিম এবং প্লাগইনগুলির পর্যালোচনা

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

2

একটি Weebly সাইটে বোতাম একটি গুরুত্বপূর্ণ উপাদান যা কল টু অ্যাকশনের উদ্দেশ্যে ব্যবহৃত হয়। উদাহরণস্বরূপ, আপনি একটি পিডিএফ ডকুমেন্ট ডাউনলোড করার জন্য ব্যবহারকারীদের অনুরোধ করার জন্য একটি বোতাম যুক্ত করতে পারেন। যেহেতু Weebly এর থিমের সংখ্যা খুবই কম, এটি একটি সাধারণ সমস্যা যা আপনি পুরো থিমটি পছন্দ করতে পারেন কিন্তু সেই থিমের বোতামে অনুপ্রবেশ শৈলী থাকতে পারে। এই জাতীয় পরিস্থিতিতে আপনার নিজস্ব কাস্টম সিএসএস বা অন্যান্য থিমের বোতাম স্টাইলের সাথে ডিফল্ট উইবলি বোতাম উপাদানটির স্টাইল প্রতিস্থাপন করা সহজ। এই নিবন্ধটি ডিফল্ট উইবলি বোতাম উপাদান কাস্টমাইজ করার সম্ভাবনা ব্যাখ্যা করে।

ডিফল্ট বোতাম উপাদান যোগ করা হচ্ছে

Weebly ডিফল্টভাবে একটি ড্র্যাগ অ্যান্ড ড্রপ বাটন এলিমেন্ট প্রদান করে যা চারটি ভিন্ন ধরনের কাস্টমাইজ করা যায়। বাটন এলিমেন্টকে “স্ট্রাকচার" এলিমেন্টের ক্যাটাগরিতে ভাগ করা হয়েছে। ডিফল্টভাবে ব্যবহারকারীরা ছোট বোতামের দুটি স্টাইল এবং বড় বোতামের দুটি স্টাইল যোগ করতে পারেন।

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

Weebly ডিফল্ট বোতাম শৈলী

সমস্ত নন-রেসপনসিভ থিমগুলিতে Weebly একটি বাটন তৈরি করতে ইমেজ ব্যবহার করে এবং সমস্ত প্রতিক্রিয়াশীল থিমগুলিতে বোতামগুলির স্টাইল "main.less" ফাইলের অধীনে নিয়ন্ত্রিত হয়। একবার ড্র্যাগ এবং ড্রপ, নিম্নলিখিত কাস্টমাইজিং অপশন দেখতে আপনার বিষয়বস্তু এলাকার বোতামে ক্লিক করুন:

  • বোতাম পাঠ্য – বাটনে প্রদর্শিত পাঠ্য।
  • বাটন স্টাইল – উপলব্ধ চারটি স্টাইলের মধ্যে একটি বেছে নিন।
  • অবস্থান – বোতামের কেন্দ্র, ডান বা বাম প্রান্তিককরণ।
  • লিঙ্ক – বোতাম পাঠ্যে লিঙ্ক যোগ করুন।
  • ব্যবধান – উপরের এবং নীচের মার্জিন সামঞ্জস্য করুন।

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

Weebly বাটন উপাদান বিকল্প

ড্র্যাগ এবং ড্রপ বাটন উপাদান ছাড়াও, Weebly ল্যান্ডিং পেজ টেমপ্লেটগুলিতে কল টু অ্যাকশন বোতামও অফার করে।

প্রতিক্রিয়াশীল থিম ব্যবহার করে আপনার Weebly সাইটে বোতামগুলি কাস্টমাইজ করার জন্য "main.less" এর অধীনে বোতামগুলির স্টাইলগুলি প্রতিস্থাপন বা সংশোধন করুন।

প্রতিক্রিয়াশীল বনাম অ-প্রতিক্রিয়াশীল

আপনার বোতামগুলির স্টাইল পরিবর্তন করার চেষ্টা করার আগে, আপনি বর্তমানে কোন ধরণের থিম ব্যবহার করছেন তা পরীক্ষা করুন। Weebly থিমগুলিতে তিন ধরণের বোতাম ব্যবহার করা হয়:

  • প্রতিক্রিয়াশীল থিমগুলিতে CSS বোতাম – উদাহরণ থিম Slick, Cento।
  • নন-রেসপনসিভ থিমের CSS বোতাম-উদাহরণ থিম ক্লিনকাট।
  • নন-রেসপনসিভ থিমের ইমেজ বাটন-উদাহরণ থিম সিটি।

ইমেজ বাটন সহ নন-রেসপনসিভ থিম- এখানে বাটন এলিমেন্ট ইমেজ ব্যবহার করে এবং CSS শুধু এই ইমেজটিকে ব্যাকগ্রাউন্ড বলে, উদাহরণ থিম হল সিটি।

CSS বোতামের সাথে নন-রেসপনসিভ থিম- ক্লিনকাটের মত থিম ইমেজ ছাড়া সম্পূর্ণ CSS বোতাম ব্যবহার করে যদিও এটি একটি নন-রেসপনসিভ থিম।

রেসপন্সিভ থিম – স্লিক, সেন্টো, পেপার ইত্যাদি সব লেটেস্ট থিম সম্পূর্ণ রেসপন্সিভ এবং বোতাম এলিমেন্ট সিএসএস কোড থেকে তৈরি।

আমরা প্রতিক্রিয়াশীল এবং নন-রেসপনসিভ উভয় থিমের বাটনের স্টাইল কিভাবে পরিবর্তন করব তা নিয়ে আলোচনা করব।

কেস 1-অ-প্রতিক্রিয়াশীল থিমগুলিতে কাস্টম বোতাম চিত্র যুক্ত করা

Weebly বাটন উপাদানটির গুরুত্বপূর্ণ বৈশিষ্ট্য হল পাঠ্যের দৈর্ঘ্যের সাথে সামঞ্জস্য করার ক্ষমতা। প্রবেশ করা পাঠ্যের দৈর্ঘ্য অনুসারে বোতামটি স্বয়ংক্রিয়ভাবে সামঞ্জস্য হয়ে যাবে। একটি বোতামকে দুটি ছবিতে বিভক্ত করে এটি অর্জন করা হয়। আরও এগিয়ে যাওয়ার আগে, একটি Weebly সাইটে বোতাম চিত্রগুলি কোথায় সংরক্ষিত আছে তা বুঝতে নীচের পদক্ষেপগুলি অনুসরণ করুন।

  • আপনার Weebly অ্যাকাউন্টে লগইন করুন এবং সম্পাদনার জন্য সাইটটি নির্বাচন করুন।
  • "থিম" ট্যাবে নেভিগেট করুন এবং "HTML / CSS সম্পাদনা করুন" বোতামে ক্লিক করুন।
  • "সম্পদ" বিভাগের অধীনে আপনি নীচে দেখানো হিসাবে বিভিন্ন বোতাম চিত্র দেখতে পাবেন:

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

Weebly নন-রেসপনসিভ থিমের বোতাম চিত্র

আমরা লক্ষ্য করেছি যে সমস্ত অ-প্রতিক্রিয়াশীল থিমগুলি বোতামগুলির জন্য চিত্রগুলি ব্যবহার করে ছোট এবং বড় বোতামের জন্য 9 সেট চিত্র (মোট 18) রয়েছে কিন্তু CSS এ 2 টি নির্দিষ্ট ছবি একটি বোতামের পটভূমি হিসাবে ব্যবহার করে। "Main_style.css" চেক করুন এবং বোতামগুলির জন্য কি কি ছবি ব্যবহার করা হয়েছে তা খুঁজে বের করুন। সিটি থিমের নিচের উদাহরণ দেখায় যে "button-highlight.png" এবং "button-highlight-large.png" যথাক্রমে ছোট এবং বড় বোতামের জন্য ব্যবহৃত হয়।

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

অ-প্রতিক্রিয়াশীল থিমগুলিতে বোতামের জন্য ব্যবহৃত ছবিগুলি

আপনি যদি এই বোতামগুলি পছন্দ না করেন তবে কেবল 9 টি সেট থেকে উপলব্ধ চিত্রগুলির মধ্যে একটি চিত্র পরিবর্তন করুন। আপনি "button-highlight.png" কে "button-purple.png" এ পরিবর্তন করুন। যদি আপনি বিদ্যমান কোনো বোতাম ইমেজ পছন্দ না করেন তবে অনুরূপ আকার এবং বিভক্ত শৈলী দিয়ে আপনার নিজস্ব কাস্টম ছবি তৈরি করুন এবং "সম্পদ" বিভাগে আপলোড করুন। "ব্যাকগ্রাউন্ড" সম্পত্তির জন্য "main_style.css" এ ছবির নাম ব্যবহার করা নিশ্চিত করুন।

কেস 2-অ-প্রতিক্রিয়াশীল থিমগুলিতে CSS বোতামগুলি কাস্টমাইজ করা

আপনি যদি আপনার অ-প্রতিক্রিয়াশীল থিমের "সম্পদ" বিভাগের অধীনে কোনও বোতাম চিত্র না পান তবে "বোতাম" বিভাগটি দেখতে "main_style.css" চেক করুন। নিচে ক্লিনকাট থিম থেকে CSS কোড দেওয়া হয়েছে যা আপনার প্রয়োজন অনুযায়ী ব্যাকগ্রাউন্ড, কালার, হোভার ইফেক্ট ইত্যাদি কাস্টমাইজ করা যায়।

/* Buttons --------------------------------------------------------------------------------*/ /* Small structure & regular style */ .wsite-button { background: red; background: -moz-linear-gradient(top,#444 0,#333 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#444),color-stop(100%,#333)); background: -webkit-linear-gradient(top,#444 0,#333 100%); background: -o-linear-gradient(top,#444 0,#333 100%); background: -ms-linear-gradient(top,#444 0,#333 100%); background: linear-gradient(top,#444 0,#333 100%); border: 1px solid #000; box-shadow:inset 0 0 15px rgba(0,0,0,0.25); -moz-border-radius: 3px; border-radius: 3px; color: white !important; font-size: 13px; font-weight: 700; padding: 3px 25px; text-align: center; text-decoration: none !important; text-shadow: 0px -1px 1px rgba(0,0,0,0.7); } .wsite-button:hover { background-position:0 0; box-shadow:0 1px 4px rgba(0,0,0,0.3); } .wsite-button:active { background-position:0 0; } .wsite-button-inner { color: #fff !important; padding:0; background: none; } .wsite-button:hover .wsite-button-inner { background:none; } .wsite-button:active { padding:4px 25px 2px; } /* Large structure & regular style */ .wsite-button-large .wsite-button-inner { font-size:14px; padding:0; } .wsite-button-large .wsite-button-inner { background: none; } /* Highlighted styles */ .wsite-button-highlight, .wsite-button-large.wsite-button-highlight { background: #0370EA; background: -moz-linear-gradient(top,#0370EA 0,#0370EA 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#0370EA),color-stop(100%,#0370EA)); background: -webkit-linear-gradient(top,#0370EA 0,#0370EA 100%); background: -o-linear-gradient(top,#0370EA 0,#0370EA 100%); background: -ms-linear-gradient(top,#0370EA 0,#0370EA 100%); background: linear-gradient(top,#0370EA 0,#0370EA 100%); border: 1px solid #0052ad; box-shadow:inset 0 0 18px rgba(0,0,0,0.02); } .wsite-button-highlight:hover, .wsite-button-large.wsite-button-highlight:hover { box-shadow:0 1px 4px rgba(0,0,0,0.3); } .wsite-button-highlight .wsite-button-inner { background-image: none; } .wsite-button-large.wsite-button-highlight .wsite-button-inner { background-image: none; }

এখন সম্পাদকের কাছে ফিরে যান এবং বোতাম উপাদানটিকে বিষয়বস্তু এলাকায় টেনে আনুন। আপনি দেখতে পাবেন বোতামটি নতুন স্টাইলের সাথে থাকবে যেমনটি আপনি "main.less" তে সংজ্ঞায়িত করেছেন।

কেস 3 – প্রতিক্রিয়াশীল থিমগুলিতে ওয়েবেলি বোতামগুলি কাস্টমাইজ করা

সমস্ত সাম্প্রতিক Weebly থিমগুলি প্রতিক্রিয়াশীল এবং বোতাম তৈরির জন্য শুধুমাত্র CSS কোড ব্যবহার করে। উপরোক্ত আলোচনা ব্যাখ্যা, প্রাসঙ্গিক সিএসএস বোতাম শৈলী "/ অধীনে" main.less "ফাইলে সংজ্ঞায়িত করা হয় বোতাম /" অধ্যায়। যদি আপনার থিম CSS- এ portimport ফাংশন ব্যবহার করে, তাহলে CSS এর জন্য সংশ্লিষ্ট বোতাম ফাইলটি চেকআউট করুন। এখানে আপনাকে ডিফল্ট বোতাম স্টাইল পরিবর্তন করতে এই কোডগুলি আপনার নিজস্ব কাস্টম CSS বোতাম কোড দিয়ে প্রতিস্থাপন করতে হবে।

নিচে Weebly বাটনের জন্য CSS স্টাইলের সংজ্ঞা দেওয়া হল:

  • .wsite- বোতাম-ছোট বোতাম
  • .wsite- বোতাম: হোভার-ছোট বোতামের জন্য হোভারিং প্রভাব
  • .wsite- বোতাম: সক্রিয়-ছোট বোতামে ক্লিক করার সময় প্রভাব
  • .wsite- বোতাম-ভিতরের-ফন্টের আকার এবং রঙের মতো অভ্যন্তরীণ উপাদান শৈলী নির্ধারণ করুন

একইভাবে বড় বোতামগুলি .wiste-button-large CSS ক্লাস ব্যবহার করবে।

দ্রষ্টব্য: যদি আপনার সাইটে একটি ব্লগ পৃষ্ঠা যোগ করা থাকে, কিছু থিম ব্লগ পোস্টের বোতামের জন্য একটি অতিরিক্ত CSS ক্লাস .blog-button যোগ করতে পারে।

আপনি নিজেরাই এই CSS কোডগুলি পরিবর্তন করতে পারেন অথবা প্রয়োজনীয় CSS পেতে যেকোনো অনলাইন CSS বাটন জেনারেটর টুল ব্যবহার করতে পারেন। উদাহরণস্বরূপ, নীচের সিএসএস কোড দিয়ে ডিফল্ট ছোট বোতাম কোডগুলি প্রতিস্থাপন করে ছোট বোতাম শৈলীগুলি গ্রেডিয়েন্ট দিয়ে পরিবর্তন করা যেতে পারে:

.wsite-button { border-top: 1px solid #96d1f8; background: #6594d6; background: -webkit-gradient(linear, left top, left bottom, from(#7a3e9c), to(#6594d6)); background: -webkit-linear-gradient(top, #7a3e9c, #6594d6); background: -moz-linear-gradient(top, #7a3e9c, #6594d6); background: -ms-linear-gradient(top, #7a3e9c, #6594d6); background: -o-linear-gradient(top, #7a3e9c, #6594d6); padding: 14.5px 29px; -webkit-border-radius: 39px; -moz-border-radius: 39px; border-radius: 39px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0; color: white; font-size: 24px; font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif; text-decoration: none; vertical-align: middle; } .wsite-button:hover { border-top-color: #28597a; background: #28597a; color: #ccc; } .wsite-button:active { border-top-color: #1b435e; background: #1b435e; }

পুরানো এবং নতুন CSS কোড সহ বোতাম উপাদান পরিবর্তন নীচের একটি নমুনা থিম দেখানো হয়:

কিভাবে Weebly সাইটে বাটন যোগ এবং কাস্টমাইজ করবেন?

Weebly তে নতুন CSS বাটন

দ্রষ্টব্য: আপনি একই পদ্ধতিতে বড় বোতাম শৈলী পরিবর্তন করতে পারেন। প্রকাশিত সাইটে বোতাম ভাঙা এড়াতে ছোট এবং বড় উভয় বোতাম শৈলীর জন্য CSS কোডগুলি পরিবর্তন করা নিশ্চিত করুন।

Weebly ব্যবহারকারীদের জন্য কাজটি সহজ করার জন্য, Weebly CSS ক্লাস ব্যবহার করে আমাদের তিনটি স্টাইলের বোতাম রয়েছে। আপনি "/ অধীনে সিএসএস প্রতিস্থাপন করতে পারেন বোতাম বোতাম স্টাইল পরিবর্তন করার কোড নিচে এক সঙ্গে /" আপনার "main.less" এর অধ্যায়।

স্টাইল 1:

/* Buttons */ .wsite-button, .wsite-editor .wsite-button { height: auto; padding: 0; background: none; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .wsite-button .wsite-button-inner, .wsite-editor .wsite-button .wsite-button-inner { height: auto; padding: 8px 12px; background: #333333; color: #ffffff; border: 2px solid #333333; border-radius: 1px; text-transform: uppercase; letter-spacing: 0.05em; white-space: normal; font-family: 'Quattrocento Sans', sans-serif; font-size: 14px; font-weight: 700; line-height: normal; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .wsite-button-large, .wsite-editor .wsite-button-large { background: none; } .wsite-button-large .wsite-button-inner, .wsite-editor .wsite-button-large .wsite-button-inner { padding: 12px 16px; font-family: 'Quattrocento Sans', sans-serif; font-size: 16px; font-weight: 700; line-height: normal; } .wsite-button:hover .wsite-button-inner { background: #ffffff; color: #333333; border: 2px solid #333333; } .wsite-button-highlight, .wsite-button-large.wsite-button-highlight, .wsite-editor .wsite-button-highlight, .wsite-editor .wsite-button-large.wsite-button-highlight { background: none; } .wsite-button-highlight .wsite-button-inner, .wsite-button-large.wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-large.wsite-button-highlight .wsite-button-inner { background: #b9b9b9; color: #ffffff; border: 2px solid #b9b9b9; } .wsite-button-highlight:hover .wsite-button-inner, .wsite-button-large.wsite-button-highlight:hover .wsite-button-inner { background: #a1a1a1; border: 2px solid #a1a1a1; }

স্টাইল 2:

/* Buttons */ .wsite-button, .wsite-editor .wsite-button { height: auto; padding: 0; background: none; } .wsite-button .wsite-button-inner, .wsite-editor .wsite-button .wsite-button-inner { height: auto; padding: 10px 16px; background: #35A89A; color: white; border-radius: 0; text-transform: uppercase; letter-spacing: .07em; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 500; line-height: normal; -webkit-transition: all 350ms ease-in; -moz-transition: all 350ms ease-in; -ms-transition: all 350ms ease-in; -o-transition: all 350ms ease-in; transition: all 350ms ease-in; } .wsite-button-large { background: none; } .wsite-button-large .wsite-button-inner { padding: 12px 20px; font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 500; line-height: normal; } .wsite-button:hover .wsite-button-inner { background: #177267; } .wsite-button-highlight, .wsite-button-large.wsite-button-highlight, .wsite-editor .wsite-button-highlight, .wsite-editor .wsite-button-large.wsite-button-highlight { background: none; } .wsite-button-highlight .wsite-button-inner, .wsite-button-large.wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-large.wsite-button-highlight .wsite-button-inner { background: white; color: #35A89A; border: 2px solid #35A89A; } .wsite-button-highlight:hover .wsite-button-inner, .wsite-button-large.wsite-button-highlight:hover .wsite-button-inner { background: #35A89A; color: white; }

স্টাইল 3:

/* Buttons */ .wsite-button, .wsite-editor .wsite-button { display: inline-block; height: auto; padding: 0; background: none; } .wsite-button:focus, .wsite-editor .wsite-button:focus { outline: none; } .wsite-button .wsite-button-inner, .wsite-editor .wsite-button .wsite-button-inner { display: inline-block; height: auto; padding: 8px 16px; background: #a1a1a1; color: white !important; border: 2px solid #a1a1a1; border-radius: 2px; text-transform: uppercase; letter-spacing: 0.05em; white-space: normal; font-family: 'Open Sans', sans-serif; font-size: 13px; font-weight: 400; line-height: normal; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; } .wsite-button-large, .wsite-editor .wsite-button-large { display: inline-block; height: auto; padding: 0; background: none; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .wsite-button-large .wsite-button-inner, .wsite-editor .wsite-button-large .wsite-button-inner { display: inline-block; height: auto; padding: 12px 24px; background: #a1a1a1; color: white !important; border: 2px solid #a1a1a1; border-radius: 2px; text-transform: uppercase; letter-spacing: 0.05em; white-space: normal; font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 400; line-height: normal; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; } .wsite-button:hover .wsite-button-inner, .wsite-button-large:hover .wsite-button-inner { background: transparent; color: #a1a1a1 !important; } .wsite-button-highlight, .wsite-button-large.wsite-button-highlight, .wsite-editor .wsite-button-highlight, .wsite-editor .wsite-button-large.wsite-button-highlight { background: none; } .wsite-button-highlight .wsite-button-inner, .wsite-button-large.wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-highlight .wsite-button-inner, .wsite-editor .wsite-button-large.wsite-button-highlight .wsite-button-inner { background: transparent; color: #808080 !important; border: 2px solid #808080; } .wsite-button-highlight:hover .wsite-button-inner, .wsite-button-large.wsite-button-highlight:hover .wsite-button-inner { background: #808080; color: white !important; }

এমবেড কোড এলিমেন্ট ব্যবহার করে কাস্টম সিএসএস বাটন যোগ করা

বিদ্যমান উপাদান কাস্টমাইজ করা একটি কঠিন কাজ যেহেতু Weebly ঘন ঘন কোড পরিবর্তন করে এবং সেই সাথে বোতামের সুযোগটি খুব বেশি আকর্ষণ ছাড়াই বিদ্যমান স্টাইলে সীমাবদ্ধ থাকবে। সবচেয়ে সহজ এবং সহজ উপায় হল বিদ্যমান কোডগুলি পরিবর্তনের পরিবর্তে আপনার নিজস্ব কাস্টম CSS বোতাম যুক্ত করা। এটি আপনার Weebly সাইটে বিভিন্ন ধরনের 2D এবং 3D CSS বোতাম যুক্ত করার অফুরন্ত সম্ভাবনা প্রদান করে। কিন্তু সমস্যা হল যে আপনাকে "বোতাম" উপাদান ব্যবহার না করে পূর্বনির্ধারিত স্টাইলের সাথে "এম্বেড কোড" উপাদান ব্যবহার করে প্রতিবার যোগ করতে হবে।

উদাহরণস্বরূপ, আপনি " এম্বেড কোড " এলিমেন্টের ভিতরে ডাউনলোড করা এইচটিএমএল এবং সিএসএস এর অধীনে বিভিন্ন স্টাইলের সাথে গ্রেডিয়েন্ট বোতাম যুক্ত করতে পারেন (স্টাইলশীটের অধীনে সিএসএস) (নন-রেসপনসিভ থিমের জন্য "main_style.css" এবং রেসপনসিভের জন্য "main.less" থিম)।

এই Weebly গ্রেডিয়েন্ট বোতাম উইজেটের জন্য CSS / HTML কোড ডাউনলোড করুন।

রেকর্ডিং উত্স: webnots.com
Leave A Reply

এই ওয়েবসাইট আপনার অভিজ্ঞতা উন্নত করতে কুকি ব্যবহার করে। আমরা ধরে নেব যে আপনি এটির সাথে ঠিক আছেন, তবে আপনি ইচ্ছা করলে অপ্ট-আউট করতে পারেন। আমি স্বীকার করছি আরো বিস্তারিত