سعید شعبانی

تغییر منوی وردپرس به منو ریسپانسیو در زمان کوچک شدن صفحه

4 پست در این موضوع قرار دارد

ارسال شده در (ویرایش شده)

سلام دوستان

چجوری میشه منوی وردپرس که با فهرست ها ایجاد کردیم را در زمان کوچک شدن صفحه به منویی مثل Off.canvas یا دیگر منو ها که در صفحات کوچک از جمله موبایل و تبلت کارایی داشته باشند تبدیل کرد؟ لطفا اگر ممکن هست واضح توضیح بدید چون خیلی به این مورد نیاز دارم.

مثل این سایت ها:

post-412-0-94877300-1372686964_thumb.jpg post-412-0-33386400-1372686967_thumb.jpg post-412-0-88119600-1372686969_thumb.jpg

post-412-0-30818500-1372686920_thumb.jpg

ویرایش شده در توسط سعید شعبانی
0

به اشتراک گذاری این پست


لینک به پست

سلام

نیاز به کد دارید یا توضیح؟

0

به اشتراک گذاری این پست


لینک به پست

سلام

نیاز به کد دارید یا توضیح؟

کد و اگر هم توضیح بدید بد نیست

0

به اشتراک گذاری این پست


لینک به پست

بهرحال باید فهرست شما واکنش گرا بشه:


http://www.hongkiat.com/blog/responsive-web-nav/
http://www.studionashvegas.com/responsive-design-2/a-responsive-menu-solution-for-wordpress/
http://www.designwebidentity.com/effortlessly-wordpress-responsive-pagelines/

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط farzadnoruzi
      سلام.
      دوستان من قالب zerif-lite رو روش کار کردم و کلی تغییرات دادم ولی بیشتر روی css ها کار کردم. الان منو واکنش گراش کار نمیکنه . لطفا بررسی کنید و راهنمایی کنید که مشکل از چیه
      منو باز نمیشه . البته باز میشه و خودکار بسته میشه . ثابت نمیمونه ... لطفا راهنمایییییی
      http://new.hofmannprofile.com
    • توسط alibashiri
      سلام دوستان
      لطفا در مورد آبشاری کردن این قالب کمک کنید
      برنامه هدر اینه
      <?php
      /**
       * The Header for our theme.
       * Displays all of the <head> section and everything up till <div id="content">
       */
      ?><!DOCTYPE html>
      <html <?php language_attributes(); ?>>
      <head>
      <?php zerif_top_head_trigger(); ?>
      <meta charset="<?php bloginfo( 'charset' ); ?>">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="profile" href="http://gmpg.org/xfn/11">
      <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
      <?php wp_head(); ?>
      <?php zerif_bottom_head_trigger(); ?>
      </head>
      <?php if(isset($_POST['scrollPosition'])): ?>
          <body <?php body_class(); ?> onLoad="window.scrollTo(0,<?php echo intval($_POST['scrollPosition']); ?>)">
      <?php else: ?>
          <body <?php body_class(); ?> >
      <?php endif;
          zerif_top_body_trigger();
          
          /* Preloader */
          if(is_front_page() && !is_customize_preview() && get_option( 'show_on_front' ) != 'page' ):
       
              $zerif_disable_preloader = get_theme_mod('zerif_disable_preloader');
              
              if( isset($zerif_disable_preloader) && ($zerif_disable_preloader != 1)):
                  echo '<div class="preloader">';
                      echo '<div class="status">&nbsp;</div>';
                  echo '</div>';
              endif;    
          endif; ?>

      <div id="mobilebgfix">
          <div class="mobile-bg-fix-img-wrap">
              <div class="mobile-bg-fix-img"></div>
          </div>
          <div class="mobile-bg-fix-whole-site">

      <header id="home" class="header" itemscope="itemscope" itemtype="http://schema.org/WPHeader">
          <div id="main-nav" class="navbar navbar-inverse bs-docs-nav" role="banner">
              <div class="container">
                  <?php zerif_before_navbar_trigger(); ?>
                  <div class="navbar-header responsive-logo">
                      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
                      <span class="sr-only"><?php _e('Toggle navigation','zerif-lite'); ?></span>
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                      <span class="icon-bar"></span>
                      </button>
                          <div class="navbar-brand" itemscope itemtype="http://schema.org/Organization">
                              <?php
                              if( has_custom_logo() ) {
                                  the_custom_logo();
                              } else {
                              ?>
                                  <div class="site-title-tagline-wrapper">
                                      <h1 class="site-title">
                                          <a href=" <?php echo esc_url( home_url( '/' ) ) ?> ">
                                              <?php bloginfo( 'title' ) ?>
                                          </a>
                                      </h1>
                                      <?php
                                      $description = get_bloginfo( 'description', 'display' );
                                      if ( ! empty( $description ) ) : ?>
                                          <p class="site-description">
                                              <?php echo $description; ?>
                                          </p> <!-- /.site-description -->
                                      <?php elseif( is_customize_preview() ): ?>
                                      <p class="site-description"></p>
                                      <?php endif; ?>
                                  </div> <!-- /.site-title-tagline-wrapper -->
                              <?php } ?>
                          </div> <!-- /.navbar-brand -->
                      </div> <!-- /.navbar-header -->
                  <?php zerif_primary_navigation_trigger(); ?>
              </div> <!-- /.container -->
              <?php zerif_after_header_container_trigger(); ?>
          </div> <!-- /#main-nav -->
          <!-- / END TOP BAR -->
    • توسط vahidlb
      سلام و وقت بخیر خدمت مخاطبان عزیز.
      ابتدا خواهش می کنم این لینک رو ملاحظه بفرمایید.
      منظورم بخش "من متقاضی ... انتخاب کنید ...." هست.
      دوستان می تونید چنین افزونه ای و حتی مشابه اینو به من معرفی بفرمایید.. نیاز بسیار مبرم و حیاتی به این منو دارم
      از دوستانی که می تونن زحمت نوشتن و تولید این افزونه رو بکشن هم لطفاً پیام بدن...
      البته سال گذشته یکی از دوستان این کد را به صورت افزونه تولید کردند و الان هم کار می کنه ولی یکسری تغییرات لازم داره و به مراحلش اضافه شده،
      لذا خواهشمندم اگر ممکنه در این خصوص اعلام نظر بفرماییدو اگر پیشنهادی دارید یا افزونه مشابه اینو می شناسید خیلی ازتون ممنون خواهم شد اگر لطف کنید و راهنماییم کنید.
      با احترام و تشکر
    • توسط Fast-Learn
      سلام.
      من دارم یه قالب برای سایتم مینویسم، که طبعیتاً روی لوکالم بود. قالب کاملا توی پی سی ریسپانسیوه! یعنی وقتی صفحه ی مرورگر رو کوچیک میکنی، قالب خاصیت ریسپانسیویش کاملا صحیحه. یا وقتی از ابزار inspect element گوگل کروم قسمت تست ریسپانسیو بودنش استفاده میکنم، یا از سایتای تست ریسپانسیو بودن استفاده میکنم، باز هم کاملا سایت ریسپانسیوه!
      حالا اومدم شکل واقعیش رو توی گوشی ببینم، برای همین قالب رو روی هاست آپلود کردم، باز هم وقتی توی پی سی ریسپانسیو بودنش رو چک میکنم درسته، ولی وقتی توی موبایل نگاه میکنم اصلا ریسپانسیو نیست!
      توی چند تا موبایل تست کردم توی هیچکدوم ریسپانسیو نبود!
      برای ریسپانسیو کردن هم بیشتر جاها از قابلیتای فریم ورک materilize استفاده کردم و بعضی جاها هم دستی.
      ممنون میشم راهنماییم کنید!
      بد جوری اعصابمو خورد کرده
    • توسط PejmanDesigner
      با عرض سلام و خسته نباشید خدمت دوستانم .
      من مشکلی دارم که با جستجو نتونستم به جواب برسم شاید مواردی که جستجو می کردم اشتباه بوده .
      من می خوام در قسمت منو ها لینکی بزارم که صفحه جدیدی رو باز نکنه و به قسمت های مختلف در همون صفحه بره .
      من یک وب سایت تک صفحه دارم و برگه جدیدی ندارم . ولی می خوام با کلیک بر روی قسمت های مختلف منو بازدید کننده مستقیم اسکرول بشه به همون موقعیت .
      حالا دو سوال دارم در این رابطه
      اول اینکه ایا افزونه ای هست که این کار رو انجام بده ؟ یا اینکه باید کدی رو وارد کنم ؟ (لطفا در صورت داشتن کد ، علاوه بر کد نحوه قرار گیری هم توضیح داده شود)
      دوم اینکه اون طوری که من خیلی وقت پیش ها شنیدم مقدار پیکسل میگیره این کد که کجا اسکرول بشه ، حالا سوالم اینجاست که ما پیکسل بدیم داخل این کد ها یا افزونه آیا درحالت رسپانسیو مشکل ایجاد میشه یا نه ؟