Tạo mã ngắn cho chủ đề WordPress của chúng tôi

Kể từ khi chúng tôi bắt đầu với dự án này, chúng tôi luôn muốn nó có nhãn riêng của chúng tôi và đó là lý do tại sao mẫu thứ hai chúng tôi sử dụng DesdeLinux, nó được tạo ra bởi chúng tôi 100%.

Sau đó, các phiên bản khác theo sau và mặc dù chúng tôi có thể mua hoặc thuê một số dịch vụ web nhất định để tạo ra các thiết kế của chúng tôi như thiết kế của StudioDWeb.comhoặc mua các mẫu đã được tạo trong ThemeForest.net, chúng tôi luôn muốn có cái của riêng mình, thích ứng với nhu cầu của chúng tôi và dừng lại WebDevelopment.com có thể giúp đỡ 😀

Dù sao, tôi đam mê Thiết kế và Phát triển Web, và tôi đã làm việc với chủ đề mới cho DesdeLinux và tôi sẽ cho bạn xem một số Ảnh chụp màn hình về cách nó trông như thế nào.

Ý tưởng không phải là vượt ra khỏi những gì chúng ta đã thích nghi, vì vậy nhiều yếu tố vẫn giữ nguyên hoặc theo cách tương tự. Tôi bắt đầu với trang chủ

Và đây là những gì các bài báo sẽ trông như thế này:

Như bạn có thể thấy, nó phù hợp với thước đo của chúng tôi và chúng tôi đã đưa vào Mã ngắn để xây dựng các bài báo.

Đó là lý do tại sao tôi muốn chia sẻ với bạn cách tạo một trong số chúng (thông tin một) trong trường hợp bạn muốn đưa chúng vào các chủ đề của mình WordPress. Ý tôi là, một cái gì đó như thế này:

Tôi không phải là một chuyên gia về lập trình với CMS này, vì vậy tôi sẽ không cố gắng giải thích tại sao và nó hoạt động như thế nào theo cách này, tôi sẽ chỉ cho bạn cách thực hiện, định kỳ.

Vì vậy, chúng tôi sử dụng «con dao quân đội Thụy Sĩ» của WordPress, Ý tôi là tệp function.php mà chúng ta thường tìm thấy trong hầu hết các chủ đề.

Ví dụ về Function.php với ShortCodes DesdeLinux

Những gì chúng tôi sẽ làm trong tệp này là thêm cấu trúc của Mã ngắn của chúng tôi và tất nhiên, nhãn hiển thị nó. Vì vậy, hay thực hiện ngay bây giơ.

Bên trong Function.php

Bên trong tệp function.php của chúng ta, những gì chúng ta sẽ đặt sẽ là cấu trúc HTML của Mã ngắn, nhưng không chỉ đơn giản là đặt các thẻ HTML như vậy. Chúng tôi sẽ có một cái gì đó như thế này:

// Hộp thông tin hàm thông tin ($ atts, $ content = null, $ code = "") {$ return = ' '; $ return. = $ content; $ return. = ' '; return $ trở lại; } // Mã ngắn add_shortcode ('thông tin', 'hộp thông tin');

Từ đây chúng tôi làm rõ một vài điều. Đầu tiên, khi chúng tôi sử dụng hai thanh, chúng tôi nhận xét ra dòng, do đó // Thông tin nó chỉ là một bình luận.

Tên của hàm, trong trường hợp này Hộp thông tin Nó có thể được thay đổi thành bất cứ điều gì chúng ta muốn, nhưng nó phải khớp với tên chúng ta sử dụng ở dòng cuối cùng.

Ví dụ:

$ return. = $ content;

Biến $ nội dung đó là nơi mà nội dung mà chúng ta đặt trong Mã ngắn đi theo mặc định, nó sẽ trả về giá trị null nếu chúng ta không đặt bất kỳ thứ gì.

Bây giờ, tên của Mã ngắn là những gì chúng tôi đặt với:

add_shortcode( 'info', 'infobox' );

Nơi bạn có thể thay đổi Thông tin cho những gì chúng tôi muốn. Bây giờ, để làm cho nó giống như ví dụ, chúng ta phải đặt:

[ info ]Este será el ShortCode de ejemplo[ /info ]

Mặc dù tất nhiên, không có khoảng trắng, mà tôi đặt vì rõ ràng Mã ngắn sẽ được kích hoạt.

Kiểu mã ngắn

Nếu bạn nhìn vào dòng trên, không có mã PHP và các biến, thì Mã ngắn trong HTML thuần túy sẽ giống như sau:

<div class="alert-info"></div>

Vì vậy, chúng ta chỉ phải áp dụng kiểu CSS.

.alert.alert-info {background: # d9edf7 url (info.png) không lặp lại 7px 50%; bán kính đường viền: 4px; border: 1px solid # bce8f1; màu: # 3a87ad; font-size: 14px; lề: 15px 15px; padding: 15px 15px 15px 50px text-align: left}

Và thế là xong .. Tôi xin nhắc lại, tôi không phải là một lập trình viên hay bất cứ thứ gì tương tự, và lời giải thích mà tôi đưa ra là cách tôi hiểu rằng Mã ngắn hoạt động 😛