رفتن به مطلب

اضافه کردن آیکن صفحات اجتماعی در قسمت فوتر قالب


Mahnaz

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

من می خوام آیکن سایت های اجتماعی مثل فیس بوک و توییر و ... رو به فوتر قالب (سمت راست توضیحات کپی رایت) اضافه کنم.

مثل عکس ضمیمه

لطفا راهنمایی کنید. مرسی

post-5962-0-07600400-1399980425_thumb.pn

لینک به ارسال

من آیکن ها رو به فوتر اضافه کردم، اما مشکلم این هست که می خوام آیکن ها رو سمت راست (روبروی عنوان Powered by Wordpress ) قرار بدم و راهش رو نمی دونم. منظور این نیست که راست چین کنم، وقتی راست چین بشه عنوان Powered by Wordpress هم میاد سمت راست. عکس ضمیمه رو ببینید متوجه میشید.

عکس قرمز مشکل من و عکس مشکی که تو پست اول، ضمیمه هستش چیزیه که مد نظرمه.

post-5962-0-93648900-1399992150_thumb.pn

ویرایش شده توسط Mahnaz
لینک به ارسال

خب آیکن ها رو آماده کنید بعد با تگ img بزارید کنار هم. داخل css استایل زیر رو بدین:


.social img{ float:right; margin:10px; }

لینک به ارسال

من آیکن ها رو به فوتر اضافه کردم، اما مشکلم این هست که می خوام آیکن ها رو سمت راست (روبروی عنوان Powered by Wordpress ) قرار بدم و راهش رو نمی دونم. منظور این نیست که راست چین کنم، وقتی راست چین بشه عنوان Powered by Wordpress هم میاد سمت راست. عکس ضمیمه رو ببینید متوجه میشید.

عکس قرمز مشکل من و عکس مشکی که تو پست اول، ضمیمه هستش چیزیه که مد نظرمه.

float دادین؟

لینک به ارسال

خب آیکن ها رو آماده کنید بعد با تگ img بزارید کنار هم. داخل css استایل زیر رو بدین:


.social img{ float:right; margin:10px; }

فونت-آیکن هستش آیکن ها، عکس نیست.

float دادین؟

float بدم میاد سمت راست دیگه! هم متن و هم آیکن ها میان سمت راست اگر float راست چین بدم

چون فوتر کپی رایت فقط همون متنی که اشاره کردم رو ساپورت میکنه، آیکن ها سلیقه ای اضافه شده.

لینک به ارسال

خب یه div بزار واسه آیکون ها و float:right بده بعد به کپی رایت float:left

لینک به ارسال

خب یه div بزار واسه آیکون ها و float:right بده بعد به کپی رایت float:left

ببینید این کد کپی رایت هستش تو فایل CSS:


#copyright-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-left: 5%; }
#copyright-wrap a { color: #fff; }
#copyright-wrap a:hover { color: #CCC; }

کد آیکن ها رو تو فایل copyright.php بعد از کدی که مربوط به کپی رایته اضافه کردم.

یعنی فونت-آیکن ها میشن جزوی از همون استایل کپی رایت، چون تو فایل css تعریف نشدن، چطوری و کجای فایل css کد تعریف کنم که آیکن ها به همون شکل عکس مشکی که اشاره داشتم به اون فورم دیده بشن؟

لینک به ارسال

نمی دونم من منظورم رو درست نمی تونم برسونم ظاهرا

ببینید شما این کد رو واسه کپی رایت در نظر بگیرید:


/* Copyright
================================================== */
#copyright-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-left: 5%; }
#copyright-wrap a { color: #fff; }
#copyright-wrap a:hover { color: #ccc; }

حالا می خوام برای آیکن ها هم کد تعریف کنم که به این شکل میشه اگه اشتباه نکنم:


/* Social
================================================== */
#social-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-right: 5%; }
#social-wrap a { color: #fff; }
#social-wrap a:hover { color: #ccc; }

خوب تو این حالت آیکن ها روبروی متن قرار نمی گیرن، میرن پایین متن کپی رایت، که مطابق نیست با چیزی که نیازه.

لینک به ارسال


/* Copyright
================================================== */
#copyright-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-left: 5%; }
#copyright-wrap a { color: #fff; float:left; }
#copyright-wrap a:hover { color: #ccc; }


/* Social
================================================== */
#social-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-right: 5%; }
#social-wrap a { color: #fff; float:right;}
#social-wrap a:hover { color: #ccc; }

تست کنید

لینک به ارسال


/* Copyright
================================================== */
#copyright-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-left: 5%; }
#copyright-wrap a { color: #fff; float:left; }
#copyright-wrap a:hover { color: #ccc; }


/* Social
================================================== */
#social-wrap { background: #FF0000; padding: 20px 0; color: #000; padding-right: 5%; }
#social-wrap a { color: #fff; float:right;}
#social-wrap a:hover { color: #ccc; }

تست کنید

تمام این راه ها رو تست کردم، حل نشد

لینک به ارسال

سلام چرا از فونت ايكون ها استفاده نميكنيد ؟!‌

ي دمو انلاين هم اگه بزارين ما ببينيم شما چي كار ميكنيد خوبه !‌

لینک به ارسال

سلام چرا از فونت ايكون ها استفاده نميكنيد ؟!‌

ي دمو انلاين هم اگه بزارين ما ببينيم شما چي كار ميكنيد خوبه !‌

از فونت آیکن استفاده می کنم، گفته بودم تو پست های قبلی

دموی آنلاین ندارم، رو لوکال تست میشه :ph34r:

لینک به ارسال

حل شد.

باید پلاگین تعریف میشد که تو فایل فانکشن و کپی رایت تعریف کردم، بعد به css استایل دادم.

تو css بعد ار کپی رایت .fa رو وارد کردم، استایل دادم، مسیر و فونت رو تعریف کردم درست شد.

ویرایش شده توسط Mahnaz
لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...