WordPress 테마에 대한 단축 코드 만들기

이 프로젝트를 시작한 이후로 우리는 항상 자체 레이블을 갖기를 원했고 이것이 우리가 사용하는 두 번째 템플릿 리눅스에서, 그것은 우리가 100 % 만들었습니다.

그런 다음 다른 버전이 따랐으며 특정 웹 서비스를 구입하거나 고용하여 다음과 같은 디자인을 만들 수 있습니다. EstudioDWeb.com, 또는 이미 생성 된 템플릿 구매 ThemeForest.net, 우리는 항상 우리 자신의 필요에 적응하고 DesarrolloWeb.com 도움이 될 수 있습니다 😀

어쨌든 저는 웹 디자인과 개발에 열정적이며 이미 새로운 주제에 대해 작업하고 있습니다. 리눅스에서 어떻게 보이는지 스크린 샷을 보여 드리겠습니다.

아이디어는 우리가 이미 적응 한 것에서 벗어나는 것이 아니기 때문에 많은 요소가 동일하거나 유사한 방식으로 유지됩니다. 홈페이지부터 시작합니다

스크린 샷 -dl

그리고 이것은 기사의 모습입니다.

스크린 샷 -dl- 포스트

보시다시피 그것은 우리의 측정에 적합하며 우리는 새로운 단축 코드 기사의 정교함을 위해.

그래서 당신의 주제에 그것들을 포함하고 싶을 경우에 그들 중 하나 (정보 하나)를 만드는 방법을 당신과 공유하게되었습니다. 워드프레스(WordPress). 내 말은, 다음과 같습니다.

이것은 ShortCode의 예입니다.

저는이 CMS를 사용하는 프로그래밍 전문가가 아니기 때문에 왜 그리고 어떻게 이런 식으로 작동하는지 설명하려고하지 않을 것입니다.

이를 위해 우리는 "스위스 군용 칼"을 사용합니다. 워드프레스(WordPress), 내 말은 파일 function.php 일반적으로 거의 모든 주제에서 찾을 수 있습니다.

대괄호 _ 함수

DesdeLinux의 단축 코드가있는 Function.php의 예

이 파일에서 수행 할 작업은 ShortCode의 구조와이를 표시하는 레이블을 추가하는 것입니다. 그래서 그것에 도달합시다.

Function.php 내부

function.php 파일 안에 넣을 것은 ShortCode의 HTML 구조가 될 것이지만 단순히 HTML 태그를 넣는 것은 아닙니다. 우리는 다음과 같은 것을 가질 것입니다.

// 정보 함수 정보 상자 ($ atts, $ content = null, $ code = "") {$ return = ' '; $ 반환. = $ 콘텐츠; $ 반환. = ' '; return $ return; } // ShortCode add_shortcode ( 'info', 'infobox');

여기에서 우리는 몇 가지를 명확히합니다. 먼저 두 개의 막대를 사용할 때 줄을 주석 처리하므로 // 정보 그것은 단지 코멘트입니다.

함수의 이름 (이 경우) 정보 상자 원하는대로 변경할 수 있지만 마지막 줄에서 사용하는 이름과 일치해야합니다.

각각 $ 반환 HTML 태그를 반환하고 첫 번째 태그 이후에 마침표를 추가해야합니다. 등호 선은 다음 기호로 끝납니다. 세미콜론

예 :

$ 반환. = $ 콘텐츠;

변수 $ 내용 ShortCode에 넣은 내용이 기본적으로 들어가는 곳입니다. 아무것도 넣지 않으면 null 값을 반환합니다.

이제 ShortCode의 이름은 다음과 같이 설정됩니다.

add_shortcode( 'info', 'infobox' );

변경할 수있는 곳 정보 우리가 원하는 것을 위해. 이제 예제처럼 보이게하려면 다음을 넣어야합니다.

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

물론 공백이 없어도 분명히 ShortCode가 활성화되기 때문입니다.

ShortCode 스타일

PHP 코드와 변수없이 위의 줄을 보면 순수 HTML의 ShortCode는 다음과 같습니다.

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

따라서 CSS 스타일 만 적용하면됩니다.

.alert.alert-info {background : # d9edf7 url (info.png) no-repeat 7px 50 %; 테두리 반경 : 4px; 테두리 : 1px 단색 # bce8f1; 색상 : # 3a87ad; 글꼴 크기 : 14px; 여백 : 15px 15px; 패딩 : 15px 15px 15px 50px text-align : left}

그리고 그게 다입니다 .. 반복합니다. 저는 프로그래머 나 그런 것이 아닙니다. 제가 제공 한 설명은 ShortCode가 작동한다는 것을 어떻게 이해하는지에 대한 것입니다 😛


기사의 내용은 우리의 원칙을 준수합니다. 편집 윤리. 오류를보고하려면 여기에.

9 코멘트, 당신의 것을 남겨주세요

코멘트를 남겨주세요

귀하의 이메일 주소는 공개되지 않습니다. 필수 필드가 표시되어 있습니다 *

*

*

  1. 데이터 책임자 : Miguel Ángel Gatón
  2. 데이터의 목적 : 스팸 제어, 댓글 관리.
  3. 합법성 : 귀하의 동의
  4. 데이터 전달 : 법적 의무에 의한 경우를 제외하고 데이터는 제 XNUMX 자에게 전달되지 않습니다.
  5. 데이터 저장소 : Occentus Networks (EU)에서 호스팅하는 데이터베이스
  6. 권리 : 귀하는 언제든지 귀하의 정보를 제한, 복구 및 삭제할 수 있습니다.

  1.   남은 72

    나는 그것이 어떻게 보이는지, 나는 당신을 축하합니다.

    1.    엘라 브

      감사합니다. 갈 길이 멀지 만 감사합니다.

  2.   로저스

    아주 좋아요 !! 나는 내 WP에서 그러한 테마를 좋아할 것입니다.
    축하합니다!

    1.    엘라 브

      아직 넣지 않았습니다. 팔 수 있어요 HAHAHAHAHA .. 농담입니다 🙂

  3.   마누엘 E.

    좋아요, 공유해 주셔서 감사합니다.
    이러한 유형의 리소스는 웹에서 매우 필요하며 명확하게 설명합니다.

    안녕하십니까!

  4.   엘리오타임3000

    아름다운 디자인. 내 웹 사이트에 대한 템플릿을 사용자 정의 할 수 있는지 살펴 보겠습니다.

  5.   cuervo291286

    블로거에서 할 수 있습니까?

  6.   하비에르

    글쎄, 아무것도, 나는 그것을 그대로 두었고 그것은 나를 위해 작동하지 않습니다. : /

    나는 [정보] 정보를 넣는다 [/ 정보]

    그리고 내 워드 프레스 포스트에서는 정보, 괄호가 사라지고, 뭔가 잘못되었다고 생각합니다 : /

    1.    조니 실바

      아마도 템플릿에서 ShortCodes는 내 경우와 같이 function.php에 정의되어 있지 않을 수 있습니다.이 값은 내 테마의 shortcodes.php라는 파일에 추가됩니다.