تبلیغات در اینترنت

تبلیغات در اینترنتگیفت کارت گوگل پلی
نمایش نتایج: از 1 به 2 از 2

مقاله: آموزش افزودن QR Code به ویبولتین

    1. آموزش افزودن QR Code به ویبولتین »

      آموزش افزودن QR Code به ویبولتین

      نگارش: , by (مدیریت کل سایت)
      2013/03/05 01:55 PM
      امتیاز: 

      درود.

      با فراگیر تر شدن برنامه ها و اپ های دریافت کننده QR Code و استفاده سایت های مختلف از این قابلیت و API گوگل برای این مورد به این فکر افتادیم تا یک مدیفیکشن کوچک برای این منظور تهیه کنیم .

      این کد به صورت اتوماتیک یک قسمت به نام "نمایش کد QR" به تاپیک های سایت اضافه می کنید که با کلیک بر روی آن کد QR Code به صورت اتوماتیک از روی آدرس تاپیک اضافه می شود .

      QR Code چیست ؟

      بر اساس توضیح ویکی پدیا ، QR Code یک رمزمیلهٔ ماتریسی (یا بارکد دودورا [دوبُعدی]) است. می‌توان آن را با پوینده‌های QR، تلفن همراه دوربیندار و تلفن هوشمند خواند. این بارکُد دربردارندهٔ چیدمانی از چهارگوش‌های سیاه بر روی زمینهٔ سپید است. دادهٔ نهفته می‌تواند نوشته، نشانی وب، شماره تلفن، یا دادهٔ دیگری باشد.
      بیشتر بخوانید ..

      در واقع دیگران بدون نیاز به نوشتن نام تاپیک های شما در موبایل تنها با گرفتن تصویر می توانند وارد تاپیک های شما شوند !

      نمونه زنده : اضافه کردن QRCode به ویبولتین

      اضافه کردن QR Code به ویبولتین

      مرحله 1: ابتدا کد های زیر را به ابتدای header خود اضافه کنید .

      نکته: اگر کد jQuery را در سایت خود قبلاً قرار دادید یا ورژنی دیگری از آن را روی سایت فراخوانی کرده اید نیازی نیست آن را دوباره قرار دهید .

      کد:
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
      <script>
      $(document).ready(function(){
        $(".qrtxt").click(function(){
        $(".qrimg").delay(100).slideToggle(300);
      });
      });
      
      
      $(document).ready(function(){
      $('.qrtxt').toggle(function() {
          $(this).text('پنهان شدن');
      }, function() {
          $(this).text('نمایش کد QR');
      });
      });
      </script>
      مرحله 2: کد های زیر را به additional.css اضافه کنید :

      کد:
      .qrtxt {
      background: rgb(236, 236, 236);
      border-radius: 4px;
      text-shadow: 1px 1px white;
      padding: 3px 6px;
      width: 100px;
      text-align: center;
      font-family: B Yekan,"Myriad Pro";
      direction: rtl;
      border: 1px solid #cecece;
      box-shadow: 0px 1px #cecece,0px -1px rgb(252, 252, 252) inset;
      color: rgb(119, 119, 119);
      cursor:pointer;
      }
      
      
      .qrimg {
      border-radius: 4px;
      text-shadow: 1px 1px white;
      padding: 3px 6px;
      width: 100px;
      text-align: center;
      font-family: B Yekan,BYekan,"Myriad Pro";
      direction: rtl;
      border: 1px solid #cecece;
      box-shadow: 0px 1px #cecece,0px -1px rgb(252, 252, 252) inset;
      color: rgb(119, 119, 119);
      margin-top:3px;
      display:none;
      }
      اگر فونت B Yekan را درون سایت خود قبلاً آپلود نکرده اید یا از طریق آموزش سایت آن را اضافه کنید یا این کد را هم به additional.css اضافه کنید :

      کد:
      @font-face {
       font-family: 'BYekan';
       src: url('http://www.vbiran.ir/images/vbiranv6/BYekan.eot?#') format('eot'),  /* IE6–8 */ url('http://www.vbiran.ir/images/vbiranv6/BYekan.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ url('http://www.vbiran.ir/images/vbiranv6/BYekan.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
      }
      نکته : در ویبولتین 5 قالب additional.css به css_additional.css تغییر کرده است .

      مرحله 3: کد های زیر را به هرجایی از قالب SHOWTHREAD که دوست دارید اضافه کنید :

      کد:
      <div class="qrtxt">نمایش کد QR</div>
      <div class="qrimg"><img src="https://chart.googleapis.com/chart?chs=100x100&cht=qr&chl=http://www.site.com/{vb:raw thread_url}" />
      </div>
      در کد های بالا بجای site.com آدرس سایت خود را بنویسید .

      برای مثال می توانید کد را قبل از کد <div id="pagetitle" class="pagetitle"> قرار دهید .

      امیدوارم از این آموزش لذت برده باشید .

      منبع : وی بی ایران
  1. Top | #2
    کاربر سایت

    ورژن ویبولتین
    4.2.1
    نوشته ها
    243
    میزان امتیاز
    28

    پیش فرض

    شات نمیدید

    مرحله 1: ابتدا کد های زیر را به ابتدای خود اضافه کنید . (header این کجاست میشه کامل تر بگید)
    ویرایش توسط nima12 : 2013/09/08 در ساعت 03:57 PM دلیل: ادغام دو پست

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کسانی که این مقاله را دیده اند از این مقاله ها نیز بازدید کرده اند

  1. آموزش ساده و روان افزودن فونت های فارسی به یک صفحه وب(مشخصا ویبولتین)
    توسط AliBother در انجمن آموزش CSS بصورت ساده و حرفه ای
    پاسخ: 37
    آخرين نوشته: 2015/12/14, 01:23 PM
  2. آموزش افزودن مدیر در ویبولتین (راهنمایی)
    توسط ashkan7 در انجمن پرسش و پاسخ
    پاسخ: 4
    آخرين نوشته: 2012/10/21, 11:00 PM
  3. پاسخ: 4
    آخرين نوشته: 2012/06/16, 11:10 PM
  4. آموزش اضافه کردن انتخاب همه به [code] ها در ویبولتین 4
    توسط VBIran در انجمن آموزش های وی بولتین
    پاسخ: 22
    آخرين نوشته: 2012/03/10, 07:45 PM

کلمات کلیدی این موضوع

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

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