logo
logo
تبلیغ کلیکی تاپ سایت 98

نمایش یک سایت در سایت دیگر

نمایش یک سایت در سایت دیگر
هدایت عباسی آموزش HTML

آموزش ویدئویی نمایش یک سایت در سایت دیگر

در این فیلم و آموزش ویدئویی با نمایش یک سایت در سایت دیگر و تگ iframe و ویژگی های آن آشنا می شوید.

چنانچه مشکلی در اجرای فیلم دارید از مرورگر فایرفاکس استفاده نمایید یا روی لینک زیر کلیک نمایید.

مشاهده یا دانلود فیلم بالا

در این بخش از آموزش html از تاپ سایت 98 به سراغ نمایش یک سایت در سایت دیگر می رویم.

بعضی مواقع نیاز است سایتی را در سایت خودمان یا یک صفحه html نمایش دهیم برای این کار می توانیم از دستور iframe در html استفاده نماییم.

در این آموزش ، نمایش یک سایت در سایت دیگر را بصورت کامل توضیح می دهیم. حالت های مختلف را بررسی می کنیم. می توانیم در سایزهای مختلف سایت را نمایش دهیم ، میتوانیم کادری دور آن ایجاد کنیم . میتوانیم برای آن لینک ایجاد کنیم. ما همه روشها را تست می کنیم.

دستور iframe برای نمایش سایت

دستور iframe برای نمایش سایت در سایت دیگر استفاده می شود. در src می بایست آدرس سایت را قرار دهیم.

<iframe src="https://topsite98.com/"></iframe>

دستور بالا را در بخشی از صفحه html کپی کنید. فایل را اجرا نمایید.

مشاهده می کنید در کادری وبسایت ، تاپ سایت 98 ، نمایش داده می شود.

اگر می خواهید اندازه iframe را تغییر دهید می توانید ادامه آموزش را ببینید.

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

برای نمایش یک سایت در سایت دیگر با اندازه مشخص می توانید از چند روش استفاده کنید.

در روش اول می توانید مشابه کد زیر عرض و ارتفاع را مشخص نمایید. برای مشخص کردن عرض iframe از ویژگی width استفاده می کنیم و برای ارتفاع از ویژگی height استفاده می کنیم.

<iframe src="https://topsite98.com/" width="600" height="500"></iframe>

خروجی را در تصویر زیر می بینید.

نمایش یک سایت در سایت دیگر

استفاده از css برای نمایش سایت

استفاده از css برای نمایش سایت در سایت دیگر و مشخص کردن عرض و ارتفاع باکس iframe را در مثال زیر می بینید.

در مثال زیر ما با استفاده از style توانستیم عرض و ارتفاع باکس iframe را مشخص کنیم.

<iframe src="https://topsite98.com/" style="height:700px;width:700px;"></iframe>

کادر دور iframe

کادر دور iframe را می توانیم با استفاده از css تغییر دهیم.

اگر دقت نمایید کادری دور باکس iframe قرار دارد .

برای حذف کادر دور باکس نمایش سایت می توانیم با دستور border آن را حذف نماییم. اگر مقدار border را none قرار دهید کادر حذف می شود.

<iframe src="https://topsite98.com/" width="600" height="500" style="border: none"></iframe>

 همچنین می توانیم کادری دور آی فریم iframe بیندازیم.

برای این کار می توانیم مطابق دستور زیر برای border مقداری را مشخص کنیم. در دستور زیر یک کادر با سایز 6 پیکسل و رنگ قرمز دور iframe می افتد .

<iframe src="https://topsite98.com/" width="600" height="500" style="border: 6px solid red"></iframe>

خروجی را در تصویر زیر می بینید.

نمایش یک سایت در سایت دیگر

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

برای نمایش یک سایت در سایت دیگر با کلیک می توانیم از تگ a استفاده کنیم.

برای این کار مطابق مثال زیر عمل نمایید. ابتدا iframe را قرار دهید فقط در src چیزی ننویسید و آدرس خالی باشد.

به iframe یک ویژگی name بدهید و مقدار آن را topsite98 بگذارید.

سپس یک تگ a در زیر iframe قرار داده و در ویژگی href آدرس تاپ سایت 98 را قرار دهید.

در ویژگی target مقدار topsite98 (نام iframe) قرار دهید.

<iframe src="" name="topsite98" width="600" height="400" style="border: 6px solid red"></iframe>
<p><a href="https://topsite98.com/" target="topsite98">topsite98.com</a></p>

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

امیدواریم این آموزش برای شما عزیزان مفید باشد. کدها تست شده می باشد.

موفق باشید.

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

اگر سوال یا نظری دارید در بخش کامنت ها بنویسید.اگر موضوع خاصی مد نظر شماست که در سایت موجود نیست در بخش کامنت ها بنویسید

دوره ارز دیجیتال تاپ سایت 98
دوره های آموزشی دوره های آموزشی

نظرات کاربران

از دیدگاه مرتبط با موضوع استفاده نمایید.

از تبلیغ سایت یا شبکه اجتماعی خودداری فرمایید.

برای پاسخ گویی بهتر در سایت ثبت نام نمایید و سپس سوال خود را مطرح فرمایید.

  • کامنت محمد

    2022-04-01 17:17:19

    با سلام بنده آموزش قرار دادن یک سایت در یک صفحه ی دیگر را مطالعه کردم و توانستم آن را اجرا کنم ولی نتونسم کاری که میخواهم را انجام دهم آیا این روش برای بعضی از سایتها فقط جواب میدهد یا برای همه ی سایتها؟؟؟ بنده میخواهم سایت  https://thinger.io را درون صفحه ی وب خودم قرار دهم ولی هر راهی را امتحان میکنم جواب نمیدهدممنون میشم راهنمایی بفرمایید که چرا این سایت باز نمیشود. البته برخی از سایتهای ایرانی را نیز قرار دادم و اجرا نشدند. ولی برخی دیگر اجرا شدند بی صبرانه منتظر پاسختون هستم