Hi there! Welcome to OSU Drupal Droplets!
This is Joe Fenn with Oregon State
University's Web and Mobile Services and
today we're going to continue our
exploration of the CKEditor module by
taking a look at a custom module that
has been created by our Web and Mobile Services developers. The name of the
module is Button Picker and we use this
to give our users an easy way to create
buttons. And with no further ado let's go
ahead and get into our test page by
clicking the Edit tab and once we have
our edit form up we'll go down and click
into CKEditor.
Now, one thing that you're gonna have to
make sure of is that your Text Format is
set to Full HTML, okay? These particular
buttons here will not show unless that
text format is set to Full HTML so, if
you don't see them, come on down and just
open this up and change it to Full HTML.
And, once we have the buttons visible,
let's just go ahead and create some
extra space here and then we want to
click on the button here that says BTN,
button, for Button Picker. We click that, and
it gives us a dialog box here. We're
going to enter some text so we'll just
call it "Test Button". We can choose any
number of colors here, let's go ahead and
go with a red one, and, we've got several
sizes too, from mini to large so let's go
with, actually, let's go with default. Then we'll
click OK.
So you'll see that a hyperlink shows when
we hover here but we haven't put a link
in yet. So, we actually need to add the
link by using LinkIt, so let's go ahead
and highlight this text and come on up
to our LinkIt button and click it.
Depending on what you want to link
to, you can, if it's within your site, you
can search for content within the site
and link stuff that way or we can put in
a URL if we want to go externally. Here
I will set the target to open in a new
tab and then click "Insert Link". So, of
course, we won't be able to fully test
this out until we save our content so
let's scroll on down and click the Save
butto. And then let's give our button a
test. Look at that! There it is. We have
opened up in a new tab to the Oregon
State University home page. And that's
all there is to it! This has been Joe
Fenn with Oregon State University's Web
and Mobile Services and I hope to see you
for future tutorials.
