پاسخ وردپرس
1.18K subscribers
573 photos
21 videos
299 files
1.36K links
💻 مرجع آموزش تخصصی طراحی سایت و برنامه‌نویسی
🎯 آموزش عملی HTML, CSS, JavaScript, PHP و ساخت پروژه‌های واقعی

📥 دریافت سورس‌کد دوره‌ها:
https://7reply.com/

🎥 کانال یوتیوب:
https://www.youtube.com/@replywp
اینستاگرام :
https://www.instagram.com/replywp
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
🔥 یه ایده جدید دارم برای آموزش بعدی:
می‌خوام یه افکت حاشیه الکتریکی (برق‌زنان) بسازم با HTML، CSS و کمی SVG — افکتی که می‌تونی تو کارت‌ها یا باکس‌های خاص سایت استفاده کنی 😎

اما قبل از اینکه ضبطش کنم،
می‌خوام بدونم 👇
📣 دوست داری آموزش کاملش ضبط بشه؟

اگه نظرت مثبته، با ری‌اکشن 👍 یا ❤️ نشون بده
تا اگه استقبال شد، آموزش رو ضبط کنم و توی یوتیوب بذارم 💪

https://www.youtube.com/post/UgkxOuBXTUPus468jhmCZ3Ai-99cWz31JqDT
❤9👍2
از اینجا سایت حرفه‌ای بساز! طراحی خدمات و محصولات سایت تحویل غذا 🚀

در این جلسه از پروژه طراحی قالب تحویل غذا، یاد می‌گیریم چطور بخش خدمات (چگونه کار می‌کند؟) و منوی محصولات یا محبوب‌ترین‌ها رو فقط با HTML, CSS و JS طراحی کنیم.
در این بخش تمرکز ما روی طراحی باکس‌های واکنش‌گرا، افکت‌های Hover و چیدمان حرفه‌ای کارت‌ها است تا ظاهر قالب دقیقاً مثل سایت‌های حرفه‌ای تحویل غذا بشه.

🔸 ویژگی‌های این جلسه:

طراحی بخش خدمات با چیدمان سه‌ستونه

طراحی کارت‌های محصول با دکمه و قیمت

واکنش‌گرا کردن منو برای موبایل

استفاده از CSS Grid و Flexbox

آماده برای اضافه کردن به قالب نهایی


https://youtu.be/X8GwXmsWatM?si=1I_nh73UMUH-RUhk



🎓 اگر جلسه اول رو ندیدی، از اینجا شروع کن 👇
👉 [لینک جلسه اول]
https://youtu.be/aCWbgJN_rvk?si=jQNzTaxugpT_wHKf

🎓 اگر جلسه دوم رو ندیدی، از اینجا شروع کن 👇
👉 [لینک جلسه دوم ]
https://youtu.be/AuyU3hFqTNU?si=Agsivx43ZZwxmcea
❤6
menu.zip
1.7 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨

https://youtu.be/X8GwXmsWatM?si=j0L7o1xhQRgAUpVa
❤5
ساخت کتاب سه‌بعدی فقط با HTML, CSS و JS 😍 | آموزش کامل و پروژه‌محور برای طراحان وب

در این آموزش پروژه‌محور یاد می‌گیری چطور فقط با HTML، CSS و JS یک کتاب سه‌بعدی حرفه‌ای بسازی!
اگر عاشق طراحی وب هستی و می‌خوای مهارتت رو بالا ببری، حتماً تا آخر ویدیو رو ببین ❤️

https://youtu.be/Py_QTVgtj7U?si=Ss-LJRpBBJp6Sre-
❤7
pure css 3d-file.zip
6.4 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨
https://youtu.be/Py_QTVgtj7U?si=Ss-LJRpBBJp6Sre-
❤7👍1
🎉 ۶۰۰ نفر شدیم! 🎉

باورم نمی‌شه 😍 کانال تلگراممون حالا ۶۰۰ تا همراه با انگیزه و پرانرژی داره!
از روزی که شروع کردیم تا الان، هر لایک، ریاکشن و نظری که گذاشتین باعث شد انگیزه بگیرم و آموزش‌های بیشتری بسازم 💪

📺 راستی اگه هنوز کانال یوتیوب رو دنبال نکردین، اونجا آموزش‌های کامل HTML، CSS و پروژه‌های کاربردی مرحله‌به‌مرحله قرار می‌دم.
می‌تونید از همینجا برید و ویدیوها رو ببینید 👇
🔗 لینک کانال یوتیوب
https://www.youtube.com/@replywp

❤️ ممنون از حمایت‌هاتون، چون بدون شما این مسیر ادامه پیدا نمی‌کرد.
بریم که مسیر یادگیری‌مون رو تا ۱۰۰۰ نفر ادامه بدیم! 🚀

#HTML #CSS #طراحی_وب #آموزش
❤16
راز طراحی بخش نظرات کاربران با HTML CSS JS و Swiper فاش شد!

در این جلسه از پروژه طراحی قالب تحویل غذا 🍔، بخش نظرات کاربران (User Reviews) رو طراحی می‌کنیم.
در این آموزش یاد می‌گیری چطور با HTML, CSS و کتابخانه Swiper JS یک اسلایدر زیبا و واکنش‌گرا برای نمایش نظرات کاربران بسازی ⭐️

https://youtu.be/qCCt8HkPE0w?si=2YqDAqNP20kfjyzz
❤3🔥1
part-04-file.zip
1.9 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨
https://youtu.be/qCCt8HkPE0w?si=E6j0WmDOj1eCLzzu
❤4🥰1
🎓 اگر جلسه اول رو ندیدی، از اینجا شروع کن 👇
👉 [لینک جلسه اول]
https://youtu.be/AuyU3hFqTNU?si=Agsivx43ZZwxmcea

🎓 اگر جلسه دوم رو ندیدی، از اینجا شروع کن 👇
👉 [لینک جلسه دوم ]
https://youtu.be/aCWbgJN_rvk?si=jQNzTaxugpT_wHKf

🎓 اگر جلسه دوم رو ندیدی، از اینجا شروع کن 👇
👉 [لینک جلسه سوم ]
https://youtu.be/X8GwXmsWatM?si=1I_nh73UMUH-RUhk
❤3👍2
🔥 به نظرت این کارت محصول ارزش ضبط آموزش داره؟ 🔥

همین طرح خفن رو فقط با HTML و CSS طراحی کردم 😍
هم ریسپانسیوه، هم افکت‌های جذاب داره، هم طراحی‌اش تمیز و حرفه‌ایه 💪

می‌خوام بدونم اگه شما هم دوست دارید آموزش کاملش رو ضبط کنم و داخل کانال یوتیوب بذارم،
حتماً با ری‌اکشن ❤️ یا 🔥 به من بگید تا برم سراغ ضبطش 🎥

🧠 نظرتون خیلی مهمه چون باعث میشه آموزش‌هایی بسازم که واقعاً دلتون بخواد 👇
https://www.youtube.com/post/UgkxDwhU51Gg91Rvu3TNXJefrzWn-3OnvaPe
❤12🔥2👎1
آموزش ساخت حاشیه الکتریکی (Neon Border) با HTML + CSS + SVG — بدون JS

آموزش کامل ساخت حاشیه الکتریکی (Neon Border) با فقط HTML + CSS + SVG — سریع، ریسپانسیو و بدون جاوااسکریپت. مناسب کارت‌ها، هِروها و پنل‌های سایت.

در این ویدیو از صفر تا صد یک افکت مرز نئونی و متحرک می‌سازیم: قرار است SVG برای شکل و فیلترها، و CSS برای رنگ‌دهی، Glow و انیمیشن استفاده شود. کدها ساده و قابل استفاده دوباره (component) هستند و بهینه برای موبایل در توضیحات قرار گرفته‌اند.

آنچه در این آموزش یاد می‌گیرید:

ساختار HTML ساده برای کارت/باکس

اضافه کردن SVG (stroke, filter, noise)

استایل‌دهی glow و animation با CSS

بهینه‌سازی برای موبایل و عملکرد (بدون JS)

تبدیل به کامپوننت قابل استفاده مجدد
حتماً با ری‌اکشن ❤️ یا 🔥 به من بگید این آموزش کاربردی بوده یا نه

https://youtu.be/OXLt2Jf7NzA?si=gY463oHCN4oUNGns
❤7
electric-border-file.zip
5.2 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨

https://youtu.be/OXLt2Jf7NzA?si=gY463oHCN4oUNGns
👍7❤1
از صفر تا صد: فرم ورود Glassmorphism با دکمه نمایش رمز 👁

در این ویدیو یاد می‌گیری چطور با HTML، CSS و JavaScript یه فرم ورود شیشه‌ای جذاب (Glassmorphism) بسازی که حتی دکمه نمایش رمز عبور هم داره 👁

این پروژه هم ساده‌ست، هم کاربردی و ظاهرش کاملاً مدرن و حرفه‌ایه!
🔥 مناسب برای تمرین طراحی وب و اضافه کردن به رزومه یا پروژه‌هات

📁 توی آموزش مرحله‌به‌مرحله یاد می‌گیری:

ساخت فرم لاگین با ساختار HTML

طراحی افکت شیشه‌ای با CSS (Glassmorphism)

افزودن قابلیت نمایش/مخفی کردن رمز عبور با JS

نکات حرفه‌ای برای زیباسازی و انیمیشن

👇 اگر آموزش‌های بیشتر از این سبک دوست داری، با لایک و اشتراک‌گذاری ویدیو حمایت کن ❤️
و یادت نره توی کامنت بنویسی:
https://youtu.be/u-OEs8t6SAs?si=hbyn5dSpow3tbIHi
❤6
login-form-new-FILE.zip
674.2 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨
https://youtu.be/u-OEs8t6SAs?si=DSd97UfcP52nQUjf
🔥8
This media is not supported in your browser
VIEW IN TELEGRAM
🎥 پروژه جدید: اسلایدر سه‌بعدی حرفه‌ای فقط با HTML و CSS 😍

یه پروژه فوق‌العاده آماده کردم که بدون حتی یه خط JavaScript ساخته شده!
اسلایدر به‌صورت سه‌بعدی می‌چرخه، با هاور متوقف میشه و کاملاً ریسپانسیوه ✨

به نظرتون آموزش کاملش رو ضبط کنم و بزارم داخل کانال یوتیوب؟
👇👇👇
اگه موافقین، با ریاکشن ❤️ یا 👍 حتماً بگین تا شروع کنم ضبطش 🎬

https://www.youtube.com/post/UgkxiguCfyTbYxN2y8i_EQOnTbK91hIR0J1e
❤11👍3👌1
ساخت فرم ورود و ثبت‌نام حرفه‌ای (RTL) با HTML/CSS/JS — از صفر تا صد

آموزش ساخت فرم ورود و ثبت‌نام حرفه‌ای (RTL) با HTML, CSS, JS — طراحی واکنش‌گرا، اعتبارسنجی، و افکت‌های زیبا از صفر تا صد 🚀

در این آموزش کامل و پروژه‌محور، یاد می‌گیری چطور یک فرم ورود و ثبت‌نام حرفه‌ای (RTL) را فقط با HTML, CSS و JavaScript از صفر تا صد طراحی کنی.
این فرم کاملاً راست‌چین، واکنش‌گرا (Responsive) و مناسب برای وب‌سایت‌های فارسی است.
در طول آموزش، با طراحی رابط کاربری (UI)، اعتبارسنجی فیلدها، افکت‌های جذاب CSS، و ساخت ساختار مدرن آشنا می‌شوی تا فرم ورود و ثبت‌نامی مشابه سایت‌های حرفه‌ای بسازی.

🔹 ویژگی‌های این آموزش:

طراحی کامل فرم ورود و ثبت‌نام با HTML و CSS

راست‌چین (RTL) و کاملاً فارسی‌سازی‌شده

استفاده از JavaScript برای اعتبارسنجی (Validation)

طراحی واکنش‌گرا برای موبایل و دسکتاپ

انیمیشن‌های جذاب و رابط کاربری مدرن

مناسب برای تازه‌کارها تا سطح متوسط

بدون نیاز به هیچ فریم‌ورک اضافی

🎯 نتیجه نهایی: یک فرم آماده استفاده در پروژه‌های واقعی، وب‌سایت‌های شخصی یا پنل‌های کاربری.

📦 ابزارهای استفاده‌شده:
HTML5 – CSS3 – JavaScript – Google Fonts – Remixicon

👨‍💻 اگر به طراحی وب علاقه داری و می‌خوای پروژه‌هات رو حرفه‌ای‌تر کنی، حتماً این ویدیو رو تا آخر ببین و آموزش‌های جدید رو از دست نده.

https://youtu.be/zweTbQ9STBc?si=YiXkVRmQMr9mVD3n
❤5
file.zip
3.3 KB
فایل تمرین این جلسه

❤️ فراموش نکن:
لایک 👍 + نظر 💬 + اشتراک‌گذاری 🔁
باعث میشه آموزش‌های بعدی سریع‌تر منتشر بشن ✨

https://youtu.be/zweTbQ9STBc?si=g--c16q-UU0CL8A_
❤5👍2
🔥 یه ایده‌ی جدید برای ویدیوی بعدی دارم، می‌خوام نظر شما رو بدونم 👇

خیلی وقتا یه فرم ورود و ثبت‌نام قشنگ با HTML و CSS طراحی می‌کنیم،
اما در نهایت فقط ظاهره — یعنی کاربر چیزی واقعاً ثبت نمی‌کنه و اطلاعاتش ذخیره نمی‌شه 😅

می‌خوام توی ویدیو بعدی نشون بدم چطور همین فرم ساده رو به یه سیستم واقعی و داینامیک تبدیل کنیم با PHP و MySQL 💪
طوری که کاربر بتونه:
- واقعاً ثبت‌نام کنه ✅
- وارد حساب خودش بشه 🔐
- پیام خطا یا موفقیت دریافت کنه 🎉
- اطلاعاتش داخل دیتابیس ذخیره بشه 💾

حتی امنیت هم رعایت میشه (مثل password_hash و session) تا پروژه حرفه‌ای باشه.

حالا سوال من اینه 👇
دوست دارید این آموزش کامل و مرحله‌به‌مرحله ضبط بشه؟
یا ترجیح می‌دید فقط بخش اصلی (ثبت‌نام و ورود) رو آموزش بدم؟

عدد گزینه‌تون رو توی کامنت بنویسید ❤️
👇👇👇
1️⃣ آموزش کامل از صفر تا دیتابیس
2️⃣ فقط ساخت فرم و اتصال ساده به PHP
3️⃣ فقط سورس‌کد و توضیح ویدئویی کوتاه

https://www.youtube.com/post/UgkxUXDKRWLebHaq5EVQsdxrSj2-qcr-IXwg
👌7❤4🎉1
طراحی بخش اپلیکیشن و نقشه سایت با HTML CSS JS | بخش حرفه‌ای قالب 🍔

در این جلسه می‌ریم سراغ دو بخش مهم و کاربردی قالب «تحویل غذا» 🍔
با هم یاد می‌گیریم چطور بخش اپلیکیشن (App Section) و موقعیت ما (Map Section) رو به‌صورت کاملاً واکنش‌گرا و مدرن طراحی کنیم.

🔹 طراحی بخش معرفی اپلیکیشن با دکمه دانلود و استایل جذاب
🔹 ساخت بخش نقشه سایت همراه اطلاعات تماس و ساعت کاری
🔹 تمرکز روی طراحی تمیز و حرفه‌ای با رنگ‌های برند
🔹 آماده‌سازی قالب برای جلسه بعدی (فوتر و انیمیشن‌ها)

https://youtu.be/BkQXTMWltuE?si=ZwxrXP_FAYyIKGmx
❤6😁1