為我們的WordPress主題創建簡碼

自從我們開始這個項目以來,我們一直希望它有我們自己的標籤,這就是為什麼我們在第二個模板中使用 來自Linux,由我們100%創建。

然後是其他版本,儘管我們可以購買或租用某些Web服務來創建我們的設計,例如 EstudioDWeb.com,或購買已在中創建的模板 ThemeForest.net,我們一直想擁有自己的東西,適應我們的需求並經歷 DesarrolloWeb.com 可以幫忙😀

無論如何,我對Web設計和開發充滿熱情,並且我已經在為 來自Linux 我將向您展示其外觀的一些屏幕截圖。

這個想法不是要擺脫我們已經適應的範圍,因此許多要素保持相同或相似的方式。 我從首頁開始

屏幕截圖-dl

這是文章的樣子:

截圖-dl-post

如您所見,這符合我們的標準,並且我們添加了新的 簡碼 條款的詳細說明。

這就是為什麼我想與您分享如何創建其中一個(信息之一)的情況,以防您想將它們包括在以下主題中 WordPress。 我的意思是這樣的:

這將是示例ShortCode

我不是使用此CMS進行編程的專家,因此,我不會嘗試解釋這種方式的原因和工作方式,我只會向您展示如何做到這一點。

為此,我們使用了“瑞士軍刀” WordPress,我的意思是文件 function.php 通常在幾乎所有主題中都可以找到。

括號功能

帶有DesdeLinux的短代碼的Function.php示例

我們將在此文件中執行的操作是添加ShortCode的結構,當然還要添加顯示它的標籤。 因此,讓我們開始吧。

在Function.php內部

在我們的function.php文件中,我們將放置ShortCode的HTML結構,但這並不是簡單地像這樣放置HTML標記。 我們會有這樣的事情:

//資訊功能infobox($ atts,$ content = null,$ code =“”){$ return =' '; $ return。= $ content; $ return = =' '; return $ return; } // ShortCode add_shortcode('info','infobox');

從這裡我們澄清了幾件事。 首先,當我們使用兩個條形圖時,我們將這一行註釋掉,因此 //資訊 這只是一條評論。

函數的名稱,在這種情況下 信息框 可以將其更改為我們想要的任何名稱,但它必須與我們在最後一行中使用的名稱匹配。

在每個 $回報 我們返回HTML標記是什麼,並且必須記住,在第一個標記之後,必須在 等號 該行以的符號結尾 分號

例如:

$ return。= $ content;

可變的 $內容 默認情況下,這是我們放置在ShortCode中的內容所在的位置,如果我們不放置任何內容,它將返回空值。

現在,ShortCode的名稱就是我們設置的名稱:

add_shortcode( 'info', 'infobox' );

在哪裡可以改變 信息 為了我們想要的現在,使它看起來像示例,我們必須輸入:

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

儘管當然沒有空格,但我放置了空格,因為顯然會激活ShortCode。

簡碼樣式

如果看上面的行,如果沒有PHP代碼和變量,純HTML中的ShortCode可能是這樣的:

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

因此,我們只需要應用CSS樣式。

.alert.alert-info {background:#d9edf7 url(info.png)不重複7px 50%; border-radius:4px; 邊框:1px實線#bce8f1; 顏色:#3a87ad; font-size:14px; 邊距:15px 15px; 填充:15px 15px 15px 50px text-align:left}

就是這樣..我重複一遍,我不是程序員或類似的人,我給出的解釋是我如何理解ShortCode的工作方式😛


本文內容遵循我們的原則 編輯倫理。 要報告錯誤,請單擊 這裡.

9條評論,留下您的評論

發表您的評論

您的電子郵件地址將不會被發表。 必填字段標有 *

*

*

  1. 負責數據:MiguelÁngelGatón
  2. 數據用途:控制垃圾郵件,註釋管理。
  3. 合法性:您的同意
  4. 數據通訊:除非有法律義務,否則不會將數據傳達給第三方。
  5. 數據存儲:Occentus Networks(EU)託管的數據庫
  6. 權利:您可以隨時限制,恢復和刪除您的信息。

  1.   剩餘72 他說:

    我喜歡它的外觀,向您表示祝賀。

    1.    拉夫 他說:

      謝謝,您還有很長的路要走,但謝謝。

  2.   羅傑斯 他說:

    很好!! 我很樂意在我的WP中使用這樣的主題。
    我祝賀你!

    1.    拉夫 他說:

      我還沒有放,我可以賣給你。哈哈哈哈..開玩笑🙂

  3.   曼努埃爾·E。 他說:

    太好了,謝謝分享。
    Web上非常需要這種類型的資源,以便清楚地說明情況。

    的問候!

  4.   eliotime3000 他說:

    漂亮的設計。 讓我們看看是否可以為我的網站提供該模板以對其進行自定義。

  5.   烏鴉291286 他說:

    可以在博客中完成嗎?

  6.   哈維爾 他說:

    好吧,什麼都沒有,我按原樣放置了它,對我來說不起作用,那會是什麼? :/

    我把[信息]信息[/信息]

    並且在我的wordpress帖子中僅顯示:信息,括號消失,我認為出了點問題:/

    1.    喬尼·席爾瓦(Jhonny Silva) 他說:

      也許在您的模板中,在Function.php中未定義ShortCodes,因為在我的情況下,這些值被添加到我主題的一個名為shortcodes.php的文件中