Các Quest cho trình đơn hoàn hảo ...
Đây là phần 1 của phần hướng dẫn
Phần 2 của hướng dẫn này dạy làm thế nào để xây dựng + menu dọc bảng màu tối cho ngang một
Tôi quyết định để có được Thesis chủ đề , bởi vì một trong những khách hàng của tôi thông báo với tôi về vấn đề tương thích giữa các luận án và tôi thành viên trang web wordpress plugin MemberWing. Tôi cố định nó và sau đó quyết định đi xem xét kỹ hơn Thesis và thực sự lo ngại khi xem video trên trang đầu của trang web Thesis chính - Diythemes.com .
Điều gì gây ấn tượng cho tôi là hầu hết sự chú ý đến chi tiết thân thiện với người dùng, và các tính năng SEO nhất của tất cả - đó là rất tốt nghĩ.
MemberWing plugin thành viên được thiết kế từ mặt đất lên cho các trang web thành viên có thể sẽ cần phải đưa ra như nước trái cây SEO nhiều càng tốt. Vì vậy, tôi trả tiền rất nhiều sự chú ý đến vô số các cải tiến và hoàn hảo trong SEO MemberWing. Nhiều người trong số khách hàng của riêng tôi đang yêu cầu về các chủ đề khác nhau để sử dụng và chủ đề có được như vậy cũng SEO tối ưu hóa từ bên trong sâu sẽ là một phù hợp tuyệt vời cho các thành viên nhà doanh nghiệp cổng thông tin.
Kết hợp SEO quyền hạn của MemberWing với quyền hạn SEO của chủ đề Luận án sẽ cung cấp cho cơ hội tốt nhất của xếp hạng cho các khách hàng của tôi. Vì vậy, tôi đã nhận Thesis và chơi với nó cho một ngày.
Đây là một chủ đề tuyệt vời ở tất cả các cách khác nhau. Phần menu của nó mặc dù là một chút giới hạn trong chức năng. Bắt đầu từ Thesis 1,5 + nó là một trong những đơn cấp chỉ. mong muốn bình thường của tôi là để có thể tùy chỉnh menu càng nhiều càng cần thiết. Một số trang web chỉ có vài trang, nhiều người khác đã tấn của các trang tĩnh + zillions các bài báo / bài viết + rất nhiều loại.
Vì vậy, trong thế giới lý tưởng có một cơ hội để tạo ra cái nhìn tốt đẹp hệ thống dọc menu chuyển hướng thân thiện với người sử dụng phải là một. Luận án phải ra bat đã chuyển hướng tìm kiếm tốt, nhưng tôi nhận thấy rằng tất cả các trang web dựa trên luận án đang tìm kiếm như anh em sinh đôi. Thesis Tùy biến menu menu là không thực sự dễ dàng như vậy hầu hết mọi người chỉ cần để nó như là. Không có cách nào để thay đổi thứ tự các mục trong trình đơn hoặc vị trí chúng trong giữa các trang. Và một lần nữa, khả năng tạo ra các cấu trúc menu lồng nhau là thiếu. Vì vậy, tôi quyết định để xem những gì có thể được thực hiện về nó.
Sau khi thử khoảng một nửa tá các menu / chuyển hướng bổ sung liên quan đến tôi đặt sự lựa chọn của tôi trên Wordpress Plugin Danh mục chính Danh sách NAVT .
NAVT plugin chủ yếu là máy phát điện có thứ tự danh sách ưa thích siêu và một chút khó khăn để con số untraditional giao diện admin. Điều gì gây hiểu lầm về nó là nó không thực sự tạo ra các menu tìm kiếm ưa thích của chính nó. Nó phần khó nhất của công việc mặc dù - cho bạn một khả năng trực quan kéo nhau, và tạo ra danh sách có thứ tự - bộ xương của trình đơn của bạn-to-be. Và bạn có thể tạo các menu nhiều quá. Bạn có thể kéo tất cả các loại công cụ Wordpress vào trình chuyển hướng: trang, bài viết, bài viết, thể loại, người sử dụng, khối mã, các liên kết bên ngoài, khu vực thông, dải phân cách và pha trộn và kết hợp và làm tổ và sắp xếp và tùy chỉnh chúng trong bất kỳ cấu trúc cây, giống như bạn muốn.
NAVT tạo ra cho bạn kết quả danh sách có thứ tự HTML. Thứ hai vẻ đẹp của NAVT là nó giúp bạn chèn menu mới của bạn vào chủ đề của bạn thông qua logic JQuery dựa nổi tiếng nhưng không cần phải thay đổi bất kỳ mã! NAVT cho phép bạn chỉ định: "thay thế nguyên tố này # với thực đơn NAVT mới của tôi". # Yếu tố có thể là một id hoặc lớp học của con đường menu hiện có hoặc thẻ div yếu tố đang được tạo ra bởi các chủ đề hiện tại của bạn. Vì vậy, NAVT hiện điều này thay thế cho bạn mà không buộc bạn phải đi vào mã chủ đề và làm cho nó thêm lộn xộn hơn nó đã có. Nếu mà tất cả các âm thanh như gibberish - đừng lo lắng - Tôi sẽ hướng dẫn bạn từng bước sớm. Phần thử thách của NAVT cho tất cả mọi người là bạn sẽ phải đi lên với CSS thực tế + hình ảnh + javascript code cho thực đơn của bạn mình. Và nó thuộc vào bạn để tìm ra ở đâu và làm thế nào để tích hợp các file này và làm đúng công cụ này nhận được kết nối với nhau.
Chân thành mà không biết JQuery + một số PHP + CSS + có kinh nghiệm phong nha với Wordpress - điều này là khó khăn để kéo.
Vui vẻ tôi biết công cụ này một chút vì vậy tôi đã quyết định cắn đạn và hướng dẫn nhân loại tự do trong việc xây dựng tốt nhất của các trình đơn điều hướng tốt nhất cho Wordpress. Tôi chỉ cần thiết để tìm ra nguồn cho một số tìm kiếm tốt đẹp CSS menu ngang. Tôi chọn trang web ổ năng động cho các lựa chọn tốt nhất của họ, trình diễn và các nguồn.
Tôi dành một ngày để nghiên cứu luận án và chơi với NAVT plugin. Cuối cùng tôi tự hào được tạo ra tùy chỉnh, linh hoạt, SEO tối ưu hóa, hoài bão, cấu trúc lồng nhau Nagivation cho Wordpress trang web + dựa trên luận án của tôi.
Danh sách các tính năng của hoài bão, Wordpress menu navigation lồng nhau cho Thesis Chủ đề
(Bạn GOT cho tình yêu này stuff):
- Chuyên nghiệp, sạch sẽ xem và cảm nhận.
- Hỗ trợ cho tất cả các trình duyệt hiện đại, bao gồm 6,7 MSIE, Opera, Safari, Firefox 3.x, Google Chrome trong cả hai javascript và phương thức không javascript.
- Gracefully downgradable cho các trình duyệt không javascript. Bạn sẽ được sử dụng menu, trực quan tương tự và làm việc thậm chí cho các trình duyệt javascript bị vô hiệu hoá (mặc dù chỉ dẫn cấp cao nhất sẽ được hiển thị và không có flyouts sẽ xảy ra tất nhiên khi chúng được thực hiện bằng javascript).
- các tính năng thân thiện với SEO - có thứ tự danh sách trình đơn mã được tạo ra trong HTML. Google và nhện công cụ tìm kiếm khác sẽ có thể chỉ số cấu trúc menu của bạn và tìm thấy các liên kết đến các trang bên trong.
- Hỗ trợ cho các cấp làm tổ và các menu phụ không giới hạn.
- Hỗ trợ cho bất kỳ thứ tự hoặc các trang, bài viết (thông qua người dùng định nghĩa URI), chủng loại, người sử dụng, khối mã tùy chỉnh và các liên kết bên ngoài trong trình đơn.
- Hỗ trợ các văn bản cũng như các yếu tố đơn dựa trên hình ảnh. (Tôi chưa thử những mặc dù).
- Menu cấu trúc và nội dung được điều chỉnh trực quan thông qua khu vực admin NAVT.
- Compact: JQuery flyouts dựa cho các cấp lồng nhau.
- Fast: JQuery cho menu được tải từ máy chủ Google (tôi muốn Thesis tình yêu tự nó cũng làm như vậy thay vì kéo nó tại địa phương). Điều này sẽ tăng tốc độ điều một chút.
- Khả năng mở rộng - Loại đơn là có thể chỉnh sửa và cấu hình bất cứ lúc nào thông qua các cài đặt plugin NAVT mà không cần mã hóa bất cứ nơi nào.
Tôi đã sử dụng trình đơn này tuyệt vời từ ổ đĩa động cổng thông tin như là một cơ sở. Tôi đã có mã javascript để tùy chỉnh một chút cũng như bao gồm các đoạn của PHP vào custom_functions.php để làm cho nó làm việc với các luận án. Cũng là số lượng trang từ trước, chủng loại và các bài viết từ trang web của tôi đã được sử dụng để lắp ráp cấu trúc trình đơn. Trang web của bạn sẽ được chi tiết cụ thể khác nhau - nhưng khái niệm sẽ được như nhau.
Vì vậy, hãy tiếp tục, thì chúng tôi?
Hướng dẫn từng bước để thiết lập NAVT dựa trên lồng nhau, tùy biến, hoài bão, SEO thân thiện
và chỉ cần đồng bằng mát tìm kiếm menu menu cho Wordpress và Thesis Chủ đề
- Chuyển đến bảng quản trị Wordpress. Plugins-> Add mới, tìm kiếm cho "navt". plugin này sẽ được hiển thị. Click [cài đặt], [Cài đặt bây giờ], "Kích hoạt Plugin".
- Tools-> Danh sách NAVT, Inside "Danh mục Group" khu vực tìm thấy tên nhóm "" và nhập vào: "menu1" trong lĩnh vực này, báo chí [Tạo] nút. "Menu1" diện tích hình chữ nhật đã tạo ra.
Điều này "menu1" khu vực sẽ là sân chơi chính xây dựng trình đơn. Bạn sẽ được kéo và thả ở đây yếu tố menu của bạn. - Trong "tài sản" khu vực tìm thấy "khác" hộp danh sách và click vào "sự lựa chọn" Trang chủ. "Home" thingie sẽ xuất hiện bên trong "không được gán" khu vực. Weird, eh? Đừng lo, miễn là nó hoạt động - và nó sẽ cho chúng ta.
- Kéo này "Home" thingie từ "tài sản" khu vực thành "menu1 khu vực hình chữ nhật". Nó sẽ trở thành "Home" mục trong trình đơn.
- Lặp lại các bước 3-4 cho một số trang từ "khu vực" Các trang, cũng như cho các chuyên mục trong "loại" khu vực. Kéo bất kỳ mặt hàng khác bạn muốn được vào bên trong menu của bạn "menu1" hình chữ nhật. Bạn có thể click vào các trang, chuyên mục, người dùng tùy chỉnh và một số yếu tố như danh sách chia "và khối mã" ". Mã khối là mát cách để thêm đoạn tuỳ chỉnh bên trong trình đơn.
- Bạn có thể kéo các mục menu bên trong "menu1" khu vực để sắp xếp lại thứ tự của họ.
- Bạn có thể điều chỉnh vị trí thứ bậc của từng mục trình đơn với "<" và ">" mũi tên.
- Cách bấm vào tên văn bản của từng mục trình đơn - hộp thoại mở ra tâm boggling tuỳ biến thêm cho mặt hàng này. Tôi chủ yếu là kỹ thuật được sử dụng mặc định nhưng bạn có thể đi điên và bắt đầu thực hiện menu lựa chọn dựa trên hình ảnh và thêm chunks của HTML code vào nó. Tiến hành thận trọng mặc dù.
- Đối với các menu con linkless unclikable rằng sẽ phục vụ như là "cha mẹ" cho các "tiểu trẻ em" Tôi đã sử dụng "Mã khối" loại. Ví dụ khi tùy biến các mục như khối mã tôi đã nhập cho "Menu bí danh mục" = "MemberWing" và cho "Nhập mã khối:" = "<a href='#'> MemberWing </ a>". Có href = "#" sẽ làm cho nó không thể nhấp nhưng làm cha mẹ "hợp lệ" menu lựa chọn.
- Đây là cách NAVT của tôi 'cấu trúc xây dựng menu1' trông giống như gần như hoàn thành:
- Hoàn thành xây dựng ban đầu và sau đó bấm vào "bánh" biểu tượng tùy chỉnh cấu trúc menu của bạn:
- Nó sẽ mở hộp thoại với 4 tab: Tùy chọn, Display, CSS, Theme.
- Vào "Tùy chọn" tab và chắc chắn rằng mọi thứ đều không được kiểm soát và "Tên nhóm" nói: "menu1"
- Vào "Hiển thị" và chắc chắn mọi thứ vào "nhóm menu Hiển thị trên ..." khu vực được chọn [x]. Để phần còn lại tại mặc định.
- Vào "tab" CSS và chọn nút radio (x) "Đừng áp dụng CSS lớp học".
- Đi tới "Chủ đề" tab và điền nó trong như thế:
Chèn vào "Thêm thẻ trước khi ..." khu vực này code:
<div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
Chèn vào "Thêm thẻ sau khi ..." khu vực này code:
<br style='clear: left' /></div> - Báo chí [lưu / đóng] nút
- Tại tòa nhà này từ bên trong menu điểm NAVT tùy chọn plugin hoàn tất.
Bây giờ là lúc để làm một điều chỉnh nhỏ cho Thesis chủ đề để làm cho nó sẵn sàng. Cho rằng chúng ta cần phải thêm một vài tùy chỉnh các tập tin - CSS và javascript mà thuộc về trình đơn và cập nhật custom_functions.php Thesis ' - Tải về toàn bộ các tập tin ở đây .
- Giải nén kho lưu trữ. Nếu bạn có cập nhật của bạn với các tùy chỉnh custom_functions.php của bạn - bạn cần phải hợp nhất chúng với công cụ của tôi. Tôi sẽ để nó vào bạn.
Nếu bạn không chạm vào nó - cảm thấy tự do để ghi đè lên nó với tôi. Xin lưu ý: Tôi thích vị trí menu dưới tiêu đề trang web (mặc định là ở trên) - để điều chỉnh của tôi bao gồm ưu đãi này là tốt. - Tải lên kho lưu trữ bao gồm tất cả các thư mục con và các tập tin dưới của bạn chủ đề Thesis 'tuỳ chỉnh' thư mục, như thế này:
.../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
Tôi đã không đụng custom.css - Tôi thích giữ CSS menu cụ thể theo địa điểm riêng của họ để tránh tạo ra lộn xộn bên trong custom.css - Lúc này, bạn có thể tải lại trang web của bạn và xem mới đẹp mới hoài bão, lồng nhau, SEO tối ưu hóa trình đơn.
- Bạn luôn luôn có thể trở lại các thiết lập và tùy chỉnh NAVT menu của bạn với sự lựa chọn nhiều hơn hoặc đặt lại vị trí bất cứ điều gì. Nó sẽ được phản ánh trên trang web tự động.
Con đường phía trước ...
Hướng dẫn này bao gồm ví dụ sáng tạo của một loại menu. Tôi chơi với một số khác - chỉ để xem làm thế nào tối màu menu sẽ như:
Thesis chủ đề - multilevel CSS menu lồng nhau - tối palette
Tôi nghĩ rằng đó là khá tốt đẹp. Có rất nhiều mẫu hơn điều hướng có tại Dynamic Drive - tất cả chúng đều có thể tùy chỉnh cho luận án và chủ đề khác Wordpress với nỗ lực của một số:
Dynamic Drive menu ngang
Tôi hy vọng bạn sẽ tìm thấy hướng dẫn này có lợi và hữu ích. Như tôi đã nói, có thể tùy biến bất kỳ những menu cho luận án - đó là đưa ra thời gian và mong muốn làm cho nó xảy ra.
Tôi có thể làm điều này làm việc cho bạn trên cơ sở hợp đồng. Chỉ cần chọn menu mà bạn thích, liên hệ với tôi và tôi sẽ làm việc trên code và hướng dẫn cho website của bạn.
$ 20
Và tất nhiên nếu bạn đang lên đến xây dựng siêu tối ưu hóa SEO wordpress thành viên cao cấp cổng thông tin - giải pháp tốt nhất cho việc này:
Thesis Chủ đề + MemberWing plugin thành viên + tự lưu trữ trên máy Wordpress của khóa học.
