رفتن به مطلب

راهنمایی برای کد


AmiRoo

پست های پیشنهاد شده

درود.دوستان من 2تا کد زیر را گرفتم داخل همه سایت هام می خوام استفاده کنم.

 

css:

.btn-secondary{color:#fff;background-color:#6c757d;border-color:#6c757d}.btn-secondary:hover{color:#fff;background-color:#2b3034;border-color:#545b62}.btn-secondary.focus,.btn-secondary:focus{box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}.btn-secondary.disabled,.btn-secondary:disabled{color:#fff;background-color:#6c757d;border-color:#6c757d}.btn-secondary:not(:disabled):not(.disabled).active,.btn-secondary:not(:disabled):not(.disabled):active,.show>.btn-secondary.dropdown-toggle{color:#fff;background-color:#545b62;border-color:#4e555b}.btn-secondary:not(:disabled):not(.disabled).active:focus,.btn-secondary:not(:disabled):not(.disabled):active:focus,.show>.btn-secondary.dropdown-toggle:focus{box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}

html

 میزبانی توسط <a href="#" class="btn btn-secondary">سایت من</a>

یا از

<div class="row">
    <div class="col-xs-12"><div class="small text-uppercase" style=text-align:center;> <i class="fas fa-copyright"></i>میزبانی توسط <a href="http://www.#.ir/"><kbd>site me</kbd></a></div></div>
</div>

 

حالا چند تا سوال دارم

1-می خوام داخل دکمه مثل خوده متن یک ایکن از font awesome بزارم ,هرکاری نشد!

2-باکس مربع برای هر سایت فرق می کنه,می خوام سایزشو کمی کوچک تر کنم چه کار کنم؟!بعضی ها بزرگتر میشه بعضی ها کوچک تر

3-این کد بوت استرپ بود ,کلاسشو برداشتم داخل هر سی اس اس که می خوام بزارم,درسته؟مشکلی نداره ؟ ولی داخل سایت های که بوت استرپ نیستند میزارم خراب میشه

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

درود.

1 . برای استفاده از font awesome شما باید کتابخانه و فونت مخصوصش رو روی قالب سوار کنید تا بتونید از آیکن هاش استفاده کنید.

2 . توی کدی که دادید، باکسی تعریف نشده، فقط بکگراند برای یک لینک به صورت CSS نوشته شده. بنا بر استایل های عمومی و اندازه خود متن، این باکسی که می گید هم تغییر اندازه میده طبیعتا. ولی می تونید با استفاده از دستورات width و height یا padding اندازه این بک گراند رو ثابت کنید.

3 . برداشتن و کپی کردن قسمتی از یک فایل CSS همیشه جواب نمیده. ممکنه در همون فایل CSS برای یک عنصر HTML چندین دستور وجود داشته باشه که در مکان های مختلف باشه. برای مثال توی سومین کدی که دادید، کلس های row و small و col-xs-12 و حتی تگ شخصی kbd هر کدوم می تونند یک سری دستورات CSS داشته باشند که استایل های اختصاص داده شده به هر یک از این کلس ها، روی تگ های داخلی هم تاثیر گذار هست.

برای مثال یک کلس btn-secondary روی یک لینک اختصاص داده شده و به صورت جداگانه در فایل CSS براش استایل تعریف شده. اما خود این لینک ممکنه در یک DIV دیگه ای با کلس row قرار داشته باشه. که داخل فایل css امکان وجود چنین دستوری برای استایل دهی هست :

.row .btn-secondary {
	font-size: 15px;
}

در چنین حالتی، فقط زمانی استایل روی لینک با کلس btn-secondary اعمال میشه که داخل یک DIV با کلس row قرار گرفته باشه و زمانی که بخواهید کلس btn-secondary رو خارج از عنصر row استفاده کنید، استایل ها اعمال نخواهند شد.

 

امیدوارم تونسته باشم منظور رو به خوبی منتقل کنم بهتون و اینکه بتونید مشکلتون رو ریشه یابی کنید.

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

سلام وقت بخیر

من یه مشکل در قالب آوادا دارم اینکه وقتی از طریق قالب و افزونه fusion builder  اسلایدر پست و یا اسلایدر تصاویر شاخص صفحه میزارم   وقتی بصورت خودکار در حال پخش هستن  ارتفاع صفحه سایت مدام در حال اسکرول شدنه. یه فیلم چند ثانیه ای به پیوست فرستادم ببینید لطفا.

یعنی باید تمام تصاویرم رو  از لحاظ ارتفاع   پیکسلشون رو برابر کنم و بعد آپلود کنم!

کدی هست که دوستان در اختیارم بزارن که بشه چارچوب هر المان رو ثابت نگه دارم و فرقی نداشته باشه که تصاویر با چه پیکسلی باشن؟  لطفا راهنمایی کنید که هر بخش از تنظیمات المان ها در fusion builder  دارای قسمتی بنام css class هست  اینجا باید کدی رو برای رفع مشکل قرار بدم یا کد باید در قالب یا افزونه قرار داده بشه. ممنون

لینک ها تنها برای اعضای سایت قابل نمایش است.

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

در در 27 اردیبهشت 1397 در 04:47، hamedi گفته است :

سلام وقت بخیر

من یه مشکل در قالب آوادا دارم اینکه وقتی از طریق قالب و افزونه fusion builder  اسلایدر پست و یا اسلایدر تصاویر شاخص صفحه میزارم   وقتی بصورت خودکار در حال پخش هستن  ارتفاع صفحه سایت مدام در حال اسکرول شدنه. یه فیلم چند ثانیه ای به پیوست فرستادم ببینید لطفا.

یعنی باید تمام تصاویرم رو  از لحاظ ارتفاع   پیکسلشون رو برابر کنم و بعد آپلود کنم!

کدی هست که دوستان در اختیارم بزارن که بشه چارچوب هر المان رو ثابت نگه دارم و فرقی نداشته باشه که تصاویر با چه پیکسلی باشن؟  لطفا راهنمایی کنید که هر بخش از تنظیمات المان ها در fusion builder  دارای قسمتی بنام css class هست  اینجا باید کدی رو برای رفع مشکل قرار بدم یا کد باید در قالب یا افزونه قرار داده بشه. ممنون

لینک ها تنها برای اعضای سایت قابل نمایش است.

درود.

اول باید بگم که بهتر بود خودتون یک تاپیک مجزا ایجاد می کردید. سوال کردن داخل تاپیک دیگران کار مناسبی نیست!

دوم اینکه شما یا باید تصاویر رو هم اندازه طراحی کنید، یا اینکه از دستور width و height برای بخش اسلایدر استفاده کنید. اگر هم تصاویر اسلایدر به صورت background-image توی CSS تعریف میشن، می تونید از background-size: cover استفاده کنید تا تصاویر پس زمینه فقط روی همون بخش اعمال بشن.

 

ولی بیشتر به مشکلتون میخوره با همون width و height حل بشه.

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

در در 26 اردیبهشت 1397 در 16:57، Masih گفته است :

درود.

1 . برای استفاده از font awesome شما باید کتابخانه و فونت مخصوصش رو روی قالب سوار کنید تا بتونید از آیکن هاش استفاده کنید.

2 . توی کدی که دادید، باکسی تعریف نشده، فقط بکگراند برای یک لینک به صورت CSS نوشته شده. بنا بر استایل های عمومی و اندازه خود متن، این باکسی که می گید هم تغییر اندازه میده طبیعتا. ولی می تونید با استفاده از دستورات width و height یا padding اندازه این بک گراند رو ثابت کنید.

3 . برداشتن و کپی کردن قسمتی از یک فایل CSS همیشه جواب نمیده. ممکنه در همون فایل CSS برای یک عنصر HTML چندین دستور وجود داشته باشه که در مکان های مختلف باشه. برای مثال توی سومین کدی که دادید، کلس های row و small و col-xs-12 و حتی تگ شخصی kbd هر کدوم می تونند یک سری دستورات CSS داشته باشند که استایل های اختصاص داده شده به هر یک از این کلس ها، روی تگ های داخلی هم تاثیر گذار هست.

برای مثال یک کلس btn-secondary روی یک لینک اختصاص داده شده و به صورت جداگانه در فایل CSS براش استایل تعریف شده. اما خود این لینک ممکنه در یک DIV دیگه ای با کلس row قرار داشته باشه. که داخل فایل css امکان وجود چنین دستوری برای استایل دهی هست :


.row .btn-secondary {
	font-size: 15px;
}

در چنین حالتی، فقط زمانی استایل روی لینک با کلس btn-secondary اعمال میشه که داخل یک DIV با کلس row قرار گرفته باشه و زمانی که بخواهید کلس btn-secondary رو خارج از عنصر row استفاده کنید، استایل ها اعمال نخواهند شد.

 

امیدوارم تونسته باشم منظور رو به خوبی منتقل کنم بهتون و اینکه بتونید مشکلتون رو ریشه یابی کنید.

ممنون

فونت اوسام نصب هست ولی باز لود نمیکنه,حتی توی w3school تست کردم نشد(ایکن)

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

در 4 ساعت قبل، AmiRoo گفته است :

ممنون

فونت اوسام نصب هست ولی باز لود نمیکنه,حتی توی w3school تست کردم نشد(ایکن)

قطعا توی نحوه ی تعریف فونت Awesome یه مشکلی هست. مگر اینکه از نسخه ی آخر این فونت استفاده کرده باشید که اگه آخرین نسخه باشه، کلس هایی که برای نمایش فونت باید استفاده بشه هم متفاوت هست.

بطور کلی برای استفاده از فونت آیکن شما باید 3 کار انجام بدید :

 

1 . فایل کتابخانه CSS فونت Awesome رو توی پوشه قالبتون قرار بدید و فایل رو توی قالب معرفی کنید. می تونید از تابع wp_enqueue_style توی فایل functions.php قالب استفاده کنید تا فایل استایل رو به قالب معرفی کنید: (فایل font-awesome.min.css رو در جایی که فایل functions.php هست قرار بدید)

function devme_fontawesome_enq() {
    wp_enqueue_style( 'font-awesome.min', get_template_directory_uri() . '/font-awesome.min.css', array(), '1.0' );
}
add_action( 'wp_enqueue_scripts', 'devme_fontawesome_enq' );

فایل استایل :

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

 

2 . فونت ها رو توی قالب آپلود کنید. طبق فایل استایل بالا، توی پوشه قالبتون (در همون مسیری که فایل بالا رو آپلود کردید) یک پوشه به نام fonts ایجاد کنید و فایل پیوست زیر رو دانلود کنید و فونت های داخل فایل رو داخل همون پوشه fonts آپلود کنید :

لینک ها تنها برای اعضای سایت قابل نمایش است.

 

 

3 . در نهایت می تونید از کد فونت آیکن توی قالبتون استفاده کنید . مثل :

<i class="fa fa-times" aria-hidden="true"></i>

توجه کنید که این فونت و استایلی که دادم مربوط به نسخه 4.7 font Awesome هست. لینک ها تنها برای اعضای سایت قابل نمایش است. بشید و کلس آیکن های مورد نظرتون رو پیدا کنید و بجای fa-times توی کد بالا قرار بدید.

لینک به دیدگاه
به اشتراک گذاری در سایت های دیگر

بایگانی شده

این موضوع بایگانی و قفل شده و دیگر امکان ارسال پاسخ نیست.

مهمان
این موضوع برای عدم ارسال قفل گردیده است.
×
×
  • اضافه کردن...