Instagram story viewer> @mahsam_web> Posts
طراح سایت/متخصص سئو(@mahsam_web)'s profile avatar HD Profile

طراح سایت/متخصص سئو

@mahsam_web

708
followers
340
following
مهسا محمدی طراح سایت با وورد پرس🧑‍💻
کمکت میکنم که کسب و کارت رو رشد بدی🦋
اگه دنبال یادگیری طراحی سایت و سئوای اینجا جایه توعه✍️
طراح لوگو وبنر
💍💜
POSTS STORIES REELS TAGGED
📱 نوار پایین موبایل رو خودت با المنتور بساز! اگه قالب سایتت نوار پایین موبایل نداره، با این روش می‌تونی خیلی راحت خودت طراحی‌ش کنی؛ بدون نیاز به کدنویسی 👌 توی این آموزش یاد می‌گیری چطور: ▫️ نوار پایین موبایل رو بسازی ▫️ آیکن حساب کاربری، سبد خرید، علاقه‌مندی و فروشگاه رو اضافه کنی ▫️ هر آیکن رو به برگه مربوط به خودش لینک بدی ▫️ نوار رو فقط در حالت موبایل نمایش بدی اگه دنبال آموزش‌های کاربردی و رایگان وردپرس و المنتور هستی، پیجمو فالو کن ❤️ #المنتور #وردپرس #طراحی_سایت #آموزش_وردپرس #آموزش_المنتور by @mahsam_web
33
2 months ago
Download
مگا منوی حرفه‌ای برای سایت فروشگاهی چطور ساخته میشه؟ 👀✨ توی این آموزش از صفر ساخت مگا منو رو با وردپرس + المنتور انجام دادم؛ از ساخت فهرست و انتخاب دسته‌بندی‌ها گرفته تا طراحی مگا منو، ساخت ستون‌ها و لینک کردن دسته‌بندی‌های اصلی و زیرمجموعه‌ها. اگه طراحی سایت انجام میدی، این آموزش رو حتماً ذخیره کن 📌 چون مگا منو یکی از اون جزئیاتیه که می‌تونه ظاهر و تجربه کاربری سایت فروشگاهی رو خیلی حرفه‌ای‌تر کنه. اگه آموزش‌های کاربردی وردپرس و طراحی سایت می‌خوای، پیج رو دنبال کن 💙 #المنتور #آموزش_طراحی_سایت #طراح_سایت #ووردپرس#مگامنو by @mahsam_web
27
2 months ago
Download
☕️ آموزش طراحی منوی کافه و رستوران؛ مرحله به مرحله توی این آموزش یاد می‌گیری چطور یک منوی جذاب و حرفه‌ای برای کافه یا رستوران طراحی کنی 👇 1️⃣ ساخت صفحه منو با وردپرس و المنتور 2️⃣ اضافه کردن بخش‌های مختلف غذا، نوشیدنی و قیمت‌ها 3️⃣ طراحی کادرهای تصویری برای نمایش جذاب محصولات 4️⃣ تنظیم فاصله‌ها، رنگ‌ها و ظاهر منو برای تجربه بهتر کاربر 5️⃣ آماده‌سازی منو برای نمایش در موبایل و QR Code با چند المان ساده می‌تونی یک منوی شیک و کاربردی برای کسب‌وکارهای غذایی بسازی 🍔✨ 💬 اگر آموزش‌های طراحی سایت کاربردی می‌خوای، پیج رو دنبال کن. ❌️حتما استوری هارو دنبال کن هرروز نکات آموزشی طراحی سایت رو برات میزارم #آموزش_طراحی_سایت #سایت#طراح_سایت #ووردپرس by @mahsam_web
23
2 months ago
Download
با این ترفند ساده، کل یک سکشن رو لینک‌دار کن 🔗✨ مناسب برای باکس‌ها، خدمات، محصولات و بخش‌های مختلف سایت. اگه آموزش‌های کاربردی و ترفندهای ساده المنتور برای طراحی سایت می‌خوای، حتماً پیج رو فالو کن 💙 #طراح_سایت #آموزش_طراحی_سایت #سایت_فروشگاهی #المنتور by @mahsam_web
17
a month ago
Download
آموزش فوتر سایت کافه و رستوران خیلی ساده و کاربردی با المنتور این فوتر رو بساز 🌹 برای آموزش های بیشتر پیج رو دنبال کن هرروز ترفند های ووردپرس نکته های آموزشی رو استوری میکنم حتما هایلایت نکته آموزشی رو ببین💙♥️ #آموزش_طراحی_سایت #المنتور#طراحی_وب #سایت_فروشگاهی by @mahsam_web
20
a month ago
Download
✨ دکمه معمولی سایتت رو با چند خط CSS جذاب‌تر کن! توی این آموزش یاد گرفتیم چطور: 🔹 متن دکمه با Hover تغییر کنه 🔹 افکت شاین روی دکمه ایجاد بشه ✨ 🔹 هاله نور به دکمه اضافه بشه 💡 🔹 بدون افزونه و فقط با CSS این افکت رو بسازیم 👇 کلاس CSS دکمه: "hover-btn" 📌 کدcss .hover-btn .elementor-button { position: relative; overflow: hidden; transition: all 0.3s ease; } .hover-btn .elementor-button-text { position: relative; z-index: 2; display: inline-block; transition: all 0.3s ease; font-size: 16px; } .hover-btn:hover .elementor-button-text { font-size: 0; } .hover-btn:hover .elementor-button-text::after { content: "بازدید از فروشگاه"; font-size: 16px; } .hover-btn:hover .elementor-button { box-shadow: 0 0 15px rgba(255,255,255,0.7), 0 0 30px rgba(255,255,255,0.4), 0 0 45px rgba(255,255,255,0.2); } .hover-btn .elementor-button::after { content: ""; position: absolute; top: 0; left: -120%; width: 55%; height: 100%; background: linear-gradient( 90deg, transparent, rgba(255,255,255,0.7), transparent ); transform: skewX(-20deg); z-index: 1; } .hover-btn:hover .elementor-button::after { animation: button-shine 0.8s ease; } @keyframes button-shine { 0% { left: -120%; } 100% { left: 150%; } } 📌 متن اصلی دکمه رو در Elementor روی «مشاهده محصول» بذار و کلاس "hover-btn" رو در بخش پیشرفته → کلاس‌های CSS وارد کن. اگه این آموزش به دردت خورد ❤️ پیج رو فالو کن تا آموزش‌های کاربردی بعدی رو از دست ندی. #طراحی_سایت #المنتور #وردپرس #CSS #آموزش_المنتور طراحی_وب ووکامرس by @mahsam_web
15
a month ago
Download
چطور برای یک محصول ووکامرس، رنگ و سایزهای مختلف تعریف کنیم؟ اگر محصولت مثل کفش یا لباس در رنگ‌ها و سایزهای مختلف ارائه میشه، لازم نیست برای هر مدل یک محصول جداگانه بسازی! 🤩 با استفاده از محصول متغیر ووکامرس می‌تونی: ✨ رنگ‌های مختلف رو تعریف کنی 📏 سایزهای مختلف رو اضافه کنی 🖼️ برای هر ترکیب، تصویر مخصوص خودش رو قرار بدی 🛍️ و کاری کنی مشتری خیلی راحت مدل موردنظرش رو انتخاب کنه. توی این آموزش مرحله‌به‌مرحله نشون دادم چطور این کار رو انجام بدی. 👌 اگه این آموزش برات مفید بود، ذخیره‌اش کن که موقع ساخت محصولات بهش نیاز پیدا نکنی. 💙 برای آموزش‌های بیشتر درباره طراحی سایت و وردپرس پیج رو دنبال کن. 🌱 #آموزش_وردپرس #آموزش_وبسایت#المنتور#سایت by @mahsam_web
30
a month ago
Download
سایت کاربردی که هر طراح سایت بهتره بشناسه! 👀💻 اگه با طراحی سایت و مخصوصاً المنتور کار می‌کنی، این سایت‌ها می‌تونن کلی از وقتت رو نجات بدن: 🔹 CSS Generator → برای ساخت سریع کدهای کاربردی CSS 🔹 Google Fonts → برای پیدا کردن و استفاده از فونت‌های مختلف 🔹 SVG Repo → برای پیدا کردن کلی آیکون و فایل SVG رایگان 📌 پیشنهاد می‌کنم این ریلز رو ذخیره کنی که هر وقت بهشون نیاز داشتی، راحت پیداشون کنی. اگه دنبال آموزش‌ها و ترفندهای کاربردی طراحی سایت و المنتور هستی، پیج رو فالو کن تا آموزش‌های بعدی رو از دست ندی. 🤍 #آموزش_طراحی_سایت #آموزش_المنتور#ووردپرس#طراح_سایت ی_سایت by @mahsam_web
10
2 months ago
Download
✨ متن طولانی داری و نمی‌خوای صفحه‌ات رو با یک متن بزرگ و طولانی شلوغ کنی؟ توی این آموزش یاد می‌گیری چطور بدون استفاده از افزونه، برای متن سایتت دکمه «مشاهده بیشتر» بسازی؛ طوری که اول فقط چند خط از متن نمایش داده بشه و با کلیک روی دکمه، ادامه متن باز بشه. 🤩 این تکنیک برای توضیحات محصولات، مقالات، صفحات فروشگاهی و بخش سوالات متداول خیلی کاربردیه. 💬 اگه کد این آموزش رو می‌خوای، فقط کلمه «کد» رو کامنت کن تا برات بفرستم. 📌 این پست رو ذخیره کن که بعداً بهش نیازت می‌شه. اگه آموزش‌های کاربردی طراحی سایت برات مفیده، پیج رو فالو کن تا آموزش‌های بعدی رو از دست ندی. 💙 #طراحی_سایت #وردپرس #المنتور #آموزش_المنتور by @mahsam_web
31
2 months ago
Download
✨ باکس تخفیف هاور دار با CSS! توی این آموزش یاد می‌گیری چطور یک باکس تخفیف شیک بسازی که در حالت عادی مخفی باشه و فقط وقتی کاربر روی تصویر هاور می‌کنه، با یک انیمیشن نرم ظاهر بشه. 👀✨ برای ساخت این افکت از کلاس CSS به اسم "discount-section" استفاده کردیم و بدون نیاز به افزونه، با HTML و CSS این باکس رو ساختیم. 📌 کدهای کامل این آموزش رو می‌خوای؟ کلمه «تخفیف» رو دایرکت کن تا کدها رو برات بفرستم. 💙 اگه به آموزش‌های کاربردی طراحی سایت و المنتور علاقه داری، پیج رو فالو کن تا آموزش‌های بعدی رو از دست ندی. 🌱 #طراحی_سایت #المنتور #وردپرس #css #html by @mahsam_web
28
2 months ago
Download
آموزش ساخت متن رونده در المنتور با HTML توی این آموزش یاد می‌گیری چطور با یک کد ساده، متن متحرک و رونده به سایتت اضافه کنی. 😍 📌 کد کامل آموزش رو همینجا برات گذاشتم؛ فقط کافیه متن‌های داخل کد رو با جمله‌های دلخواه خودت جایگزین کنی و استفاده کنی. اگه دنبال آموزش‌های رایگان طراحی سایت، المنتور و CSS هستی، پیج رو فالو کن تا آموزش‌های بعدی رو از دست ندی. ❤️ <div class="offer-marquee"> <div class="offer-text"> ✨ ۲۰٪ تخفیف ویژه &nbsp; • &nbsp; 👜 جدیدترین مدل‌های کیف &nbsp; • &nbsp; 🛍️ خرید آنلاین &nbsp; • &nbsp; 🚚 ارسال سریع </div> </div>. <style> .offer-marquee { width: 100%; overflow: hidden; white-space: nowrap; direction: ltr; } .offer-text { display: inline-block; font-size: 25px; font-weight: 800; line-height: 1.5; letter-spacing: 0.2px; animation: offerMove 16s linear infinite; padding-right: 0; } @keyframes offerMove { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } } /* موبایل */ @media (max-width: 767px) { .offer-text { font-size: 20px; animation-duration: 14s; } } </style> #المنتور #طراحی_سایت #css #html #وردپرس by @mahsam_web
28
2 months ago
Download
آیکن‌های اینستاگرام و تماس رو همیشه کنار سایتت داشته باش 📱✨ با این آموزش یاد می‌گیری چطور این آیکن‌ها رو ثابت کنی و به لینک اینستاگرام و تماس وصلشون کنی. اگه آموزش‌های کاربردی طراحی سایت می‌خوای، پیج رو فالو کن ❤️ #طراحی_سایت #المنتور #وردپرس #آموزش_المنتور #آموزش_وردپرس by @mahsam_web
19
2 months ago
Download

Download All

Save the photos and videos currently loaded on this page.

0Photos
0Videos
Ready to download 0 / 0

Keep this tab open until your download is ready.
back to up