Hướng dẫn jquery mobile với web

Hướng dẫn jquery mobile với web

Mình sẽ Hướng dẫn jquery mobile với web và wordpress

Hiện nay điện thoại smartphone đang ngày càng trở nên phổ biến , hầu hết mọi người đều có cho mình 1 điện thoại thông minh.Vì thế website cũng đang dần phải tương thích với các thiết bị dành cho mobile,thiết kế web cho mobile hay thiết kế web dạng wap ngày càng trở nên phổ biến.
jQuery Mobile là một thư viện javascript giúp tạo các website cho các thiết bi động. Bạn có thể tải jqueymobie tại đây

Hoặc trên file header của web bạn có thể thêm các dòng này vào
[code type=html]
[/code]

Đây là theme đơn giản dùng jquerymobile với wordpress bạn có thể click vào xem thử. Đây là hình mô tả

thiet ke web mobile
thiet ke web mobile

Bạn có thể thảm khảo thêm các bài viêt về jquery mobile tại đây

Giới thiếu jquery mobile
20 bài hướng dẫn jquery mobile

Để dùng jquery mobile cho wordpress bạn chỉ cần thêm functions này trong file functions.php

[code type=php]
if ( !is_admin()){
//enqueue js
if ( !function_exists(‘theme_js’) ){
function theme_js(){
wp_register_script(‘jquery-mobile’,”http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js”,array(‘jquery’),’1.3.2′);
wp_enqueue_script(‘jquery-mobile’);
wp_register_script( ‘custom-script’ , get_template_directory_uri() . ‘/js/custom.js’ , array(‘jquery’),’1.3.2′);
wp_enqueue_script(‘custom-script’);
}
}
add_action(‘wp_enqueue_scripts’,’theme_js’);

if ( !function_exists(‘theme_style’)){
wp_register_style(‘css-mobile’,”http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css”,”,’1.3.2′);
wp_enqueue_style(‘css-mobile’);
}
add_action(‘wp_enqueue_styles’,’theme_style’);
}
[/code]

Để fix lỗi jquery mobile xung đột với wp-admin bạn thêm mấy dòng này vào header nhé
[code type=html]
$(document).delegate(“#index-page”,”pageinit”, function() {
$.mobile.ajaxEnabled=false;
});

[/code]
trong đó “#index-page” là id của page, nếu có thắc mắc gì bạn có thể comments nhé.

huong dan jquery mobile voi wordpess

huong dan jquery mobile voi wordpess

Đây là các theme wordpress mà mình làm với jquery mobile bạn có thể tham khảo link trang tại gamechodienthoai.vn
Xin cảm ơn bạn đã đọc bài Hướng dẫn jquery mobile với web.Mình sẽ dẫn chi tiết thêm tại các bài viết sau.

Share this post