باکس html و css نمایش محتوای کشویی یا آکاردئونی

افزودن به علاقه‌مندی‌ها
رایگان
بروزرسانی شده در 22 مهر 1398


  •   فارسی و راست چین شده توسط وب روبیک
  •   گارانتی کیفیت محصولات وب روبیک
  •   پشتیبانی از طریق بخش نظرات
  •   ارائه اختصاصی توسط تیم وب روبیک

محصول فارسی و راست چین شده  محصول فارسی و راست چین شده

دانلود رایگان
باکس html و css نمایش محتوای کشویی یا آکاردئونی

همانطور که می دانید نمایش محتوا در سایت ها می تواند به شکل های مختلفی صورت پذیرد. اینکه شما هر محتوا را به چه شکلی به بازدید کنندگان سایتتان نمایش دهید کاملا بستگی به خودتان دارد. اما باید این را در نظر داشته باشید که ممکن است همیشه نمایش محتوا بر اساس سلیقه کاری اصولی نباشد. بنابراین سعی کنید در هنگام ایجاد باکس های نمایش محتوا به اصول تجربه کاربری نیر توجه داشته باشید. شما هرگز نباید محتوای سایت خود را به شکلی برای کاربران به نمایش بگذارید که آن ها را خیلی سریع خسته کرده و از مطالعه محتوا تا انتها پرهیز کنند.

به عنوان مثال می توان به نمایش محتوای صفحه سوالات متداول اشاره کرد. در حالت عادی شما می توانید محتوای این صفحه را به صورت کاملا پیوسته و پشت سر هم تایپ کرده و به نمایش بگذارید. اما هنگامی که تعداد پرسش و پاسخ های این صفحه زیاد باشد، کاربران با مطالعه چندین مورد اول خیلی سریع خسته شده و آن صفحه را ترک می کنند. بنابراین در این مواقع می توانید از باکس های نمایش محتوای کشویی یا آکاردئونی استفاده کنید. این نوع باکس ها به شما این اجازه را می دهند تا بخشی از متن را به صورت مخفی شده نگه دارید و هنگامی که کاربر روی عنوان مطلب کلیک می کند، ادامه محتوا به وی نمایش داده شود.

 

باکس html و css نمایش محتوای کشویی یا آکاردئونی

این باکس به صورت کاملا واکنش گرا، فارسی و راست چین شده توسط گروه وب روبیک در اختیار شما قرار داده شده است.

از جمله کاربردهای این باکس ها را می توان به موارد زیر اشاره کرد:

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

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

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

علی یعقوبی
علی یعقوبی
21 شهریور 1399 16:20

من چطور میتونم اینو توی قسمتی از قالب html خودم قرار بدم؟ هم این قالب فایل css داره و هم قالب خودم، چطوری دو تا یکیشون کنم؟

ارسال پاسخ
مصطفی کلانتری فرد
مصطفی کلانتری فرد
22 شهریور 1399 10:35

توی طراحانی محصولات وب روبیک سعی شده از نام هایی برای class و id استفاده بشه که با فریم ورک هایی مثل بوت استرپ هم پوشانی نداشته باشه. اما اگر این هم پوشانی رو دارید، لازم هست که class و id های این محصول و یا وب سایت خودتون رو تغییر بدین تا این هم پوشانی برطرف بشه. در ضمن این نکته رو در نظر داشته باشید که برخی از css های تعریف شده تنها برای پیش نمایش محصول هستن و شما برای استفاده از این قالب کافیه تنها css های مورد نیاز رو استفاده کنید.

محسن
محسن
26 اردیبهشت 1399 17:08

سلام و تشکر از شما لطفا درباره نحوه ستفاده هم توضیح دهید چون امکان نصب از طریق افزونه ها وجود نداشت.

ارسال پاسخ
مصطفی کلانتری فرد
مصطفی کلانتری فرد
26 اردیبهشت 1399 23:42

سلام وقت شما بخیر. این قالب یه قالب html و css هست و میتونید توی هر نوع وب سایتی ازش استفاده کنید. اما برای استفاده در سیستم های مدیریت محتوا مثل وردپرس، باید با ساختار فایل های پوسته آشنایی داشته باشید و زبان php رو تا حدودی بلد باشید. چنین قالب هایی به صورت افزونه نیستن و استفاده ازشون به صورت افزونه امکان پذیر نیست.

دیدگاه خود را ارسال کنید

نظر خود را برای این مطلب ارسال کنید. نشانی ایمیل شما منتشر نخواهد شد.