Tip:
Highlight text to annotate it
X
Video Transcript Okay soÖ since we still have more time and
we donít have any more questions, Iím going to take this whole short code question another
step further. And the next thing Iím going to do is Iím going to create a Twitter short
code and this Twitter short code is going to be the kind of link that encourages or
that posts the post to Twitter. And so Iím borrowing the code here from letís seeÖ
from WP recipes. Theyíve got this little piece ofÖ well, I guess itís HTML code.
Theyíve got this bit of WordPress code, itís an HTML link really that Iím going to turn
into a short code. And so weíre going to start back to custom
functions php. This isÖ yeah, thatís mine. Itís the one Iím working on. And so I guess
first off, Iíll just get full copyÖ this function defines ourÖ Twitter short code.
And function byob TwitterÖ and again thatÖ letís see. Is that going to require content?
You know, that doesnít require content so I donít need thoseÖ I donít need this atts
another content = no. I can leave that blank. And so Iím going toÖ opening and closing
brackets and then I gotta go back and capture that code again. Okay, get full copy comes
back over here and I want to say byobÖ oh I donít want to assign. Byob_twitterÖ twit.
Byob_twit = and then Iím going to paste that code. So letís see if that works actually.
So weíve got thisÖ currently reading and then thereís the permalink so Iím going
to stop it there actually and drop back down and again say, byob_twit = whoopsÖ itís
dot equals. Dot equals and then quotes. Actually, not a quote. Actually, Iím going to rid of
that php and Iím going to get rid of this and I want to drop it down again and say $byob_twit.=
and then a single quote. Title click to send this page to Twitter, target = blank show
on Twitter a and then that. Okay letís see this suggests we have a problem here. AH ref
=. What is the problem? Iím missing something. Oh yeah, Iím missing the semi-colon. Okay
so this is concatenation symbols so byob_twit = this plus this plus this and then create
a short code so add short codeÖ and then opening and closing parenthesis and I think
Iíll just say twit. And then opening and closing quotes again and byob twitter, the
name of the function, and then a semi-colon at the end of that. Okay and then we are going
to go ahead and save this. So weíve created this little bit of HTML,
a little bit of php concatenateÖoh we need the return statement, thatís right. So now
we need the return and then the $byob_twit semi-colon. Okay so thatís going to return
the contents of this to the location. We do that and letís go ahead and save this and
then weíll come over here and weíll upload it. And then weíre going to go to the site
and I think what Iím going to do here at the very beginning of this is just to twit.
So twit and update it. Iím going to refresh this and there it is. Share on Twitter. You
can see the title ñ click to send this page to Twitter. And if I click that, it brings
up my login for me to add it and so there you go. Weíve got a little short code thatÖ
so you donít need a whole plugin. You can put a little short code in that will do this
instead. And I guess since we have 10 more minutes,
we could substitute out the link for an image. So we could simply remove that, save it, and
then Iíve got to come back to the site here. Iíve got to go and get a piece ofÖ and image
for this. So we will go to Media Library, add New, select file. Iím going to go to
the place where I have my icons, my websiteís graphics. IconsÖ I think that this Twitter
ping is probably what I want so open that up. The file is empty. Okay, select a file
again. Okay, Twitter ping. Oh letís try a different uploader. Now choose a file and
data, websites, graphics, icons, Twitter ping. Upload. Okay, there it is. So now weíll edit
it and weíll copy it. And letís come back over here for a second. So I think I need
to say class = twit. Yeah I need to add a class to that and then here what weíre going to do
is .twit a. And weíre going to say background image URL. Okay, thereís the URL. Close it, semi-colon,
background image and then weíre going to say height:Ö I think thatís like 32 pixels.
32 pxÖ width colon 32 px. Okay, so we have just defined a thing. Weíve defined the a.
Weíve got a height and width of 32 pixels and itís got a background image. So weíll
go ahead and save that and weíll go ahead and save that. And weíll upload them and
letís see how that works. Iím all excited about it now.
Demo 3. I must have failed toÖ no, I didnít fail to do all that. Okay so wellÖ maybe
I didnít get it uploaded properly. Custom functions php file upload. Come back over
to here, refresh. Well this is the one reason why I use Custom File Editor. Letís see,
do I have a twit down there? I do have a twit, okay. Iím on my custom functions php file.
I have a twit down there, I definitely have a twit and I donít have that extra code.
So some of these that used to be working is no longer working. Maybe this is the problem.
Maybe what I should have really done is done us a div. And then come back down here and
the closing div. Yeah, letís try that. Okay, if we inspect that elementÖ format
text, div class twit. Class div, class twit. What did I do wrong? Oh itís missing a semi-colon. You know, you
just canít screw this stuff up and have it work. Oh, itís late at night now, thatís
my problem. So thenÖ oh, bring that back up. Itís thatÖ come back over here and then
first this. Okay so it can find that just fine, no problem
with the image itself. 48Ö oh itís display block, thatís right. Forgot about that. If
we come back over here to CSS, edit CSS, custom CSS. Come down here and say, display block.
Block semi-colon. Thatís interesting. I think I need to say clear both as well. Okay 12
48. 48, click to send this to Twitter. There it is.
And so nowÖ you know, this obviouslyÖ it think folks generally use a Twitter button
and this for this purpose but nevertheless, if we click on that now, it takes us over
to Twitter. So that clearly does the job. That was 48 by 48, display block colon block
semi-colon. And it needed to clear both of those others so clear colon both. Save that
document and we upload it. This is the one here. Upload it, come back over here and Iím
going to refresh it. Okay, what did I do? I have class twit, what
on earth did I do now? Actually, I screwed up the stuff somehow. I must haveÖ in my
fatigue, oh no. I didnít even have it changed. Yeah, because I changed with custom functions
php, not custom CSS. There we go. Off we go to Twitterland. Okay, so look at that. Itís
10 02. You got an interesting little conversation about how to use short codes in WordPress
and I think I answered the questions that were on our list so thank you very much everybody
for participating tonight. Visit our website for more video tutorials:†http://www.byobwebsite.com