افزودن دکمه آپارات در ادیتور (ریسپانسیو)

[Zebcoweb 25]

این آموزش شبیه به آموزش آقای @علی یوسفلاوی هست که اونو قبلا گزاشته بودن وی متاسفانه زیاد ریسپانسیو نبود که من کمی تغییرش دادم و تا حدالامکان به خوبی ریسپانسیو شده!

سلام دوستان ، برای افزودن دکمه آپارات به ادیتور انجمن خود مراحل زیر رو انجام دهید :

به مسیر ادمین > شخصی سازی > ویراشگر > نوار ابزار ها برید

- روی دکمه "افزودن دکمه" کلیک کنید

- روی تب "دکمه اختصاصی" کلیک کنید

موارد رو همانند پایین تنظیم کنید:

عنوان: آپارات

آیکن:

نوع: بلوک

استفاده از گزینه ها : بله

برچسب گزینه : متنی به دلخواه وارد کنید!

سپس در قسمت HTML وارد کنید :

<center>
	<p style="text-align: center;">
		<iframe allowfullscreen="true" height="555" mozallowfullscreen="true" src="https://www.aparat.com/video/video/embed/videohash/{option}/vt/frame" webkitallowfullscreen="true" width="80%"></iframe>
	</p>
</center>

ذخیره کنید و دکمه آپارات رو به نوار ابزار ادیتور اضافه کنید

نحوه استفاده: لینک آپارات که به این صورت هست : http://www.aparat.com/v/8CtkG ، شما قسمت قرمز رنگ رو بعد از کلیک روی دکمه آپارات وارد کنید.

با تشکر

ویرایش شده 16 فروردین 1399 توسط Zebcoweb

[CHRIS-7 484]

سلام.

متاسفانه آموزش تون اشتباهه ، و حتی استایل های CSS هم بدون کاربرده چون هیچ کلاسی برای کد بالا تعریف نکردید و صرفا ریسپانسیو که نیست هیچ اندازه پخش هم کوچک هست حتی در صفحه نمایشگر های بزرگ ! - منظورم به عنوان مثال :  از کلاس ها قرار دادن کد مربوطه بین تگ <div class="aparat-inner">CODE BAYAD INJA BASHE</div>

حتی آموزش آقای یوسفلاوی هم یه مقدار اشکال داره (حداقل در این نسخه های جدید)

کد ریسپانسیو و بدون مشکل رو بدون نیاز به استایل جداگانه که در iframe اجرا نمیشه رو باید تو خود کد بیاریش تا به درستی عمل کنه ، مثلا من از این کد زیر استفاده میکنم !

امتحان کنید 

 

<iframe src='https://www.aparat.com/video/video/embed/videohash/{option}/vt/frame' width='560' height='315' allowFullScreen='true' webkitallowfullscreen='true' mozallowfullscreen='true' style='width: 560px;max-width: 100%;margin: 0;'>
      </iframe>

 

ویرایش شده 16 فروردین 1399 توسط CHRIS-7

[Zebcoweb 25]

بله درست می گید کد css استفاده نمیشه و ویرایش شد مطلب! کد شما هم انگار جواب نمیده توی ویرایش گر به درستی میاره ولی توی پیش نمایش و مطلب بصورت خط نمایش میده:

چند بار هم تست کردم

ویرایش شده 16 فروردین 1399 توسط Zebcoweb

[CHRIS-7 484]

در 4 دقیقه قبل، Zebcoweb گفته است :

کد شما هم انگار جواب نمیده توی ویرایش گر به درستی میاره ولی توی پیش نمایش و مطلب بصورت خط نمایش میده:

به هر صورت کدم کاملا تست شده و حتی در نمایشگر های کوچک موبایل 320 پیکسل هم نمایش داده میشه ، در حال حاضر هم در انجمن خودمم کاربرا استفاده میکنند !

[Zebcoweb 25]

کد ریسپانسیو جدید برای دکمه های embed ویدیو از آپارات یا سایر برنامه های اشتراک ویدیو (این کد کاملا تست شده هست و عملکرد بهتری نسبت به کد های قبلی داره و برای تمامی نمایشگر ها از کوچک ترین تا بزرگترین نمایشگر ریسپانسیو است) :

<div style='width: 100%;'>    <div style="width: 100%; padding-top: 56.25%; position: relative;">        <iframe style="position: absolute; width: 100%; height: 100%; top: 0; right: 0; border: none" src="https://www.aparat.com/video/video/embed/videohash/{option}/vt/frame"                allowFullScreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"  allow="accelerometer; gyroscope; picture-in-picture; autoplay; fullscreen; encrypted-media" frameborder="0">        </iframe>    </div></div>

 

[lotfi 0]

سلام بی زحمت اموزشم بگید کد رو کجا بزاریم

[Zebcoweb 25]

اول همین تاپیک اموزش رو هم گزاشتم