2013-04-23 20 views
14

Tôi muốn có một trang chủ tĩnh khác cho phiên bản di động của trang web của mình. Nó không thực sự là một phiên bản di động bổ sung nhưng nó là đáp ứng.Cách đặt một trang chủ tĩnh khác cho phiên bản di động? (wordpress)

Tôi có thanh trượt Hình ảnh toàn màn hình ngay bây giờ được đặt làm trang chủ tĩnh. Điều này mở rộng đến màn hình, do việc xây dựng trang web có tính chất khó chịu, nhưng nó trông không đẹp trên thiết bị di động, chẳng hạn như iPhone. Vì vậy, tôi có mẫu trang chủ khác mà tôi muốn sử dụng khi trang web đang được xem trên thiết bị di động.

Điều này có thể được thực hiện bởi bất kỳ plugin nào hay nó nên được thực hiện bằng cách mã hóa? Tôi không muốn sử dụng trình chuyển đổi chủ đề hoặc thứ gì đó tương tự, tôi chỉ muốn có một bộ trang tĩnh khác cho thiết bị di động.

Bất kỳ ai biết cách thực hiện việc này?

Trả lời

10

Bạn có thể sử dụng wp_is_mobile để kiểm tra điện thoại di động, và móc vào template_redirect để tải một mẫu khác nếu điện thoại di động được phát hiện:

function so16165211_mobile_home_redirect(){ 
    if(wp_is_mobile() && is_front_page()){ 
     include(get_template_directory() . '/home-mobile.php'); 
     exit; 
    } 
} 
add_action('template_redirect', 'so16165211_mobile_home_redirect'); 
+0

Tôi có thể sai (và tôi hy vọng tôi như tôi muốn thích sử dụng nó quá) nhưng tôi hiểu rằng 'wp_is_mobile' cũng bao gồm máy tính bảng trong danh sách các thiết bị nó sẽ áp dụng chuyển hướng đến? Bạn đã tự mình sử dụng và bạn có thể xác nhận điều này không? +1 – McNab

+1

Mã không hoàn hảo, bạn có thể thấy cuộc thảo luận này thú vị: http://wordpress.stackexchange.com/questions/73273/wp-is-mobile-function – diggy

+0

Liên kết rất hữu ích, cảm ơn :) – McNab

0

Bạn có thể thử sử dụng detectmobilebrowsers kịch bản.

Vì tôi nhớ nó chỉ là một tệp php và có một chức năng yêu cầu cách xử lý các thiết bị di động khác nhau (iPhone, iPad, Android, Windows Phone, BlackBerry và Palm).

Bạn có thể hiểu rõ hơn cách hoạt động của tập lệnh bằng cách truy cập trang function generator này.

9

tôi sẽ bao gồm Mobile-Detect vào chủ đề trong thư mục riêng của mình và thêm mã này vào đầu header.php:

if(is_front_page()){ 

    include_once('mobile-detect/Mobile_Detect.php'); 
    $detect = new Mobile_Detect(); 

    if ($detect->isMobile() || $detect->isTablet()) { 
     $redirect_url = 'http://example.com/mobile_home'; 
     header('Location: ' . $redirect_url); // Redirect the user 
    } 
} 

Bạn có thể tùy chỉnh giải pháp này để làm việc cũng giống như bạn muốn. Tôi đã sử dụng điều này cho một số dự án cho các giải pháp tương tự.

+0

Tôi đã sử dụng điều này trên một vài dự án - cũng hoạt động khá độc đáo và dễ dàng tùy chỉnh. – gscharles

0

Thật dễ dàng và không cần mã hóa mọi thứ. Cài đặt plugin "Redirection" từ kho lưu trữ wordpress. 1. Chuyển đến trang cài đặt. 2. Nhập "URL nguồn" bằng trang chủ của máy tính để bàn mặc định của bạn 3. Trên tùy chọn "Đối sánh", chọn "URL và tác nhân người dùng" & trên tùy chọn "Hành động", chọn "Chuyển hướng đến URL". Nhấp vào "Thêm chuyển hướng". 4. Tùy chọn cấu hình mới sẽ xuất hiện. Đưa ra bất kỳ tiêu đề nào bạn muốn. "URL nguồn" phải để trống (có nghĩa là trang chủ cơ sở của bạn). Trên tùy chọn "Tác nhân người dùng", chọn xem iPhone hoặc Android. Trên tùy chọn "Được so khớp", đặt chuyển hướng bạn muốn cho trang chủ trên điện thoại di động.

Xong!

Bạn chắc chắn có thể phân biệt trang chủ trên máy tính để bàn và thiết bị di động dựa trên chuyển hướng bạn đã đặt trước đó với plugin đó. Tuy nhiên, bạn không thể có cùng tên url (ví dụ: www.abcde.com cho máy tính để bàn & www.abcde.com/mobilehomepage dành cho thiết bị di động).

0

này nên làm việc: (chèn nó trong functions.php)

//* Redirect homepage on mobile 
 
add_action('wp_head', 'wps_params', 10); 
 
function wps_params() { 
 
    ?> 
 
    \t <script> 
 
\t if (window.location.pathname == '/' && jQuery(window).width() <= 480) { 
 
\t window.location = "/webshop/"; 
 
\t } 
 
\t </script> 
 

 
    <?php 
 
}

Thay thế "/ webshop /" với liên kết của bạn của trang chủ điện thoại di động.

0

này là rất tốt cho tôi:

function so16165211_mobile_home_redirect(){ 
    if(wp_is_mobile() && is_front_page()){ 
     include(get_template_directory() . '/home-mobile.php'); 
     exit; 
    } 
} 
+0

Có thể mở rộng câu trả lời này với nơi mã đó nên đi, những gì nó làm và làm thế nào để sử dụng nó? – Clonkex

0

Thêm dòng sau vào functions.php của bạn nên làm như lừa:

//* Redirect homepage on mobile 

add_action('wp_head', 'wps_params', 10); 

function wps_params() { 
?> 

<script> 
if (window.location.pathname == '/' && jQuery(window).width() <= 480) { 
    window.location = "/webshop/"; 
} 
</script> 

<?php 
} 
Các vấn đề liên quan