everybody's Alex here from WP eagle calm
now in this video what we're going to be
doing is music theme which obviously is
not my talent but if it's your talent or
if you know someone that's in a band or
anything like that then you're in the
right place what we're going to be doing
is creating a website for a band using
WordPress and I'll put up on the screen
now you can have a look at what it looks
like it's got some great features like
you can add upcoming events you can add
your photo galleries sports video it's
pretty responsive so it works really
well on iPhones and iPads and all that
kind of malarkey is this so um let's get
started and what I'm going to do is I'm
going to put up a couple of videos now
quickly so if you haven't got hosting
and hosting is basically where you store
your website them if you hangul hosting
or any of that sort and and you starting
with absolutely nothing then what I need
you to do is follow one of these two
videos which I'll whip up on screen now
so this one here is for all my viewers
in the UK that takes you through setting
up hosting with the excellent tier so
host who are based in UK who I highly
recommend such as full of that video
pause this video now and go watch that
one and once you've done it all and
you've got your WordPress setup and it's
kind of vanilla default state then come
back here and press play and the same
applies to everyone else in the rest of
the world and in America you need this
video this one here and that one takes
you through setting up hosting with the
excellent Hostgator who are in America
and provided billing in dollars so
that's perfect if you're not in the UK
I've got this kind of coupon to both of
those so you'll find those on the
respective video so off you go pause
this video and watch the one of these
two depending on where you are and then
come back did you go good okay and it'll
work out okay I hope it did so you've
now obviously got your WordPress setup
you've got hosting setup you've got a
domain name and all that kind of stuff
and we're ready to start setting up a
WordPress website for a band so enough
of this chitchat and let's roll the tank
okay so let's get started building our
website for a band so I'm logged in over
at the the demo site which as already
said is at band demo WP Eagle comm and
what we would do first is obviously just
set up the the main settings and then
we're going to install the premium theme
and get configuring that so let's go to
the back end so I'm going to go and to
the dashboard I'm gonna go to the
settings and general and this is where
we can name our website so the band that
stuff so I'm just gonna call it vintage
stuff Bedford based blues band that's
the tagline that's only shown on certain
areas of the site it may not be shown at
all but it's always good to fill in
here's your oh you shouldn't have to
change that should all be set you can
set the admin email address so this is
where when anything happens on this
website
you'll get an email and it'll go to here
so that you can you know comments that
kind of thing and everything else looks
okay you just office Lee needed to set
your time zone I'm gonna set it to
London that's where I am and that's it
okay so now we're ready to install the
theme I think so let's do that
okay so the theme we're gonna be using
today is a theme called music I've used
it before for a client and it's a really
good theme it's available on the theme
forest for $58 which is a good price and
it's got everything you need it's
responsive so it works well on an iPhone
and an iPad comes with the PSD file so
if you're up for you doing your graphic
design you can make some changes and
it's got Events Management so you can
put your upcoming gigs which is perfect
for a band and it's got you know
audio/video asks management too so
without any more chitchat let's get it
going so I'm going to download it by
clicking on this link you'll also need
to sign up for theme forest
I'll put a link up on the screens it's
pretty down there now check that out and
sign up for a theme forest account if
you haven't already got one
deposit your money and you can download
it so I've downloaded it so I'm gonna
have a look at the file I'm on my
computer and what you need to do is is
extract that file where's it gone when
you've found it there it is it's just
there I'm gonna copy it into this folder
here because this is my demo so I know
everything is I've got my pictures and
things there so I say what you're gonna
need to do is expand that or unzip it
that's just unzipping and then within
there there should be a folder and
within that folder there's small folders
there's lots of folders and then within
the wordpress folder there is a another
zip file and that zip file is the one
that we're going to upload to our
websites so i'm gonna go back to the
dashboard on my website and go to plug
it sorry i'm going to go to appearance
and then themes then I'm gonna click add
new then upload theme then I can browse
to that zip file that was in the zip
file that's the one that so I'm gonna go
to my my folder that I've everything in
so yeah within that theme forest folder
which was the one we got unzipped within
the wordpress folder there is the zip
file and that's one we're gonna upload
so choose that and then click install
then it uploads it
and it's all done so once its installed
successfully you can click activate and
here we go so the theme is now installed
and we're ready to start working through
these settings okay so the first thing
I'm going to do is I'm going to install
the demo content that comes with the
theme it's great to install demo content
especially if you're getting used to
WordPress and themes in general because
it gives you an idea of how to lay pages
out and all you need to do then is just
change some of the text images to make
them your own
so on this settings page you need to
scroll down all the way down to the
bottom and then there's a link that says
download sample content so I'm gonna
download that to my computer I'm gonna
show it in the finder again I'm gonna
copy that over to oopsie to tab so I'm
gonna yes
copy that over to this folder that box
whenever everything is can get a bit of
a mess concert when you downloading all
these different things so yeah I'm gonna
grab this and just just copy it into
there and you need to expand that file
again so I'm just gonna open it unzip it
create a folder called music and then
within there and other things that we're
going to import so we now need to
install a couple of plugins to help us
do this so you're going back to the
website and then there's a link here
which takes you to the import settings
and then you click on WordPress and I'm
gonna install this plug-in so just click
install activate plug-in and run
importer so then I'm gonna choose well I
just downloaded so that's in here and
then it's in that music folder and it's
a XML file that we need and click load
file and import and then just tick the
box that says download and import the
file attachments don't worry about those
things that's to do with having a shop
which you're not going to have on this
particular website okay that's all done
that took a few minutes but it's all
done now so what we're gonna do is
import some widgets next so go to
plugins and add new yes so then just
type in import widgets it's the first
one that comes up which it importer and
exporter click OK and it's going to
stall that don't take activate okay
I then go to tools and widget importer
and exporter select the file which is in
the same the music folder again it's
called music widget stop WI II and
comport widgets
okay that's all done don't worry too
much about these these things that don't
go in that's fine so now if we go and
have a look at the front of the website
we can see there is some stuff here but
obviously it needs a bit more work to to
get it kind of looking right and that's
what we're gonna do now okay so let's go
back into the dashboard and let's go
through some of those settings so I'm
going back into appearance and then
themes settings and we'll have a look
through here so here's where you'd
upload your logo this pad doesn't have a
logo so if you don't upload one it will
just keep the text there so that's fine
for me have you got a favicon which is
you know the small icon that appears in
the tab in people's browser
you cannot wrote there needs to be no
bigger than 64 pixels by 64 you can add
a touch icon if you want and so that's
when someone adds it to their iPhone as
a kind of smart web link thing that's
when that's used that's it for this page
so let's go into homepage options and so
we've got show slider on homepage and
move the slider will automatically
that's fine number of items on the
sliders five will probably come back and
change these now here's where we're
going to set the homepage so there's the
pages that have come up now because
we've imported that demo content so
let's just see what this home page looks
like and leave it like that for now so
I'm saving those changes what I'm going
to do is I'm just going to go back to
the home page but I'm gonna open it in a
new tab so it's easy then to flick
between the front and the back otherwise
there's lots of clicks so I'm just going
to open this link in a new tab
and that hasn't worked that should be
showing a homepage now but as you see
it's not so okay there must be another
setting that we need to change so let's
go to settings and reading and let's set
it in here so I'm gonna say front page
display a static page the blog one is
called news so let's see what that's
done let's go back to the home page and
refresh okay that's better
starting to come together now so you've
got some page here's and you've got a
blurb where you can add add some text
and then you've got the recent posts and
widgets and things like that so let's
that's great if you want to edit
anything when you're logged in you can
just simply click this if I click Edit
Page it'll take me to the home page to
edit it and we can have a look at some
other layouts maybe so it's using a
template which is over here so if you
have a look at the other templates so
you've got it's not with your sidebar
and then content and then another
sidebar you got on with content one
sidebar or content so far I think what
we'll have is just one slide but I'm
going to give that so that'd be the
content of then sidebar on the right
hand side a sidebar is just where you
can add widgets things okay this is
looking okay okay so what we'll do next
is we'll sort out this menu at the top
because that's looking a bit of a mess
so I'm going to go back to this tab
which is desperate to have that I'm
going to go to appearance and menus and
that's the menu that comes with it I'm
gonna create a new menu for me so I'm
just gonna click create a new menu I'm
going to call it vintage blue the band
they do food and things vintage stuff
any
they look great menu then I can just
select the pages down here which I want
to add so these are the ones that we
imported them demo content ups if you
create any new pages they also feel yes
so I think the home the about the
contact the events and the galleries
fine oh and news that's all I want for
now and then once they've been added you
can just rearrange them so this is the
order that they're gonna appear and on
the top of the website main navigation
so I think I want a bit first
I don't want the bow over here that
looks fine let's save that and have a
look so now Oh
actually before we check this one other
thing we need to do we need to set the
location so if you click on this tab up
here which says manage locations so that
the main menu is going to be that new
vintage stuff menu settings but now if
we go back here and refresh our menu as
it's taking place is lots of room there
to add more things if we want and yeah
so now we need to work on the home page
a slider is just loading my internet
it's just suddenly gone slow it's
waiting ok so I think the next thing is
we will add some blur up to this
homepage here there open another tab but
I'm just going to find the old website
of this band and just copy and paste
some of their current copy
so you'll see let me just show you this
and their old site it looks like it's on
the 90s I put in there here we go it's
lovely this I think it's been made in
front page okay so this is their
homepage blur I'm just going to copy
this so ctrl C command C copy it to my
clipboard err then I'm gonna go back to
the home page here I'm gonna click edit
page
I'm going to paste it in here but I'm
not going to just do an old post I'm
going to edit and then paste the much
stuff that I want any any stuff coming
over from the old website basically if
you just copy and paste text from word
or from other websites some of that
style information can sometimes come
across and make your website look a bit
weird so that's done it's going view
page and have a look so I might need a
little bit styling but it will do for
now let's add some images to - here -
this slider so again back to the the -
border that I'm gonna go into slider
which is here it's free on there at the
moment let's just delete these for now
so I'm just gonna tick this box and
select all of them and then you can do a
bulk action here it's like a move to
trash you click add new I call this one
slider one so I know which one it is
okay then you can have a link in terms
of where it goes when someone clicks on
it if you want to so let's upload an
image so I've clicked on set featured
image I'm going to find the file on my
pizza but more than that that demo
folder that so here's some general pics
there we go not sure about sizing at the
moment so when we may need to resize
that we'll see how it looks but then you
can add some text in here I believe it's
try it if they put the band refresh
again the homepage I just pull slide one
so we obviously need to put it up in
here so let's cool it with the band I
have used this theme before I promise
it's just they're all different so I
forget which which ones which so let's
have a look at that okay that's good so
that would go through to a booking page
the contact page so let's just copy that
link address to the contact page and
then what I'm gonna do is just paste
that in here okay that's looking good so
let's add one more slide ER so I'm gonna
go add Neve this one can be viewed
galleries then I'm gonna set a nice
image of action oh let's look in this
one they're not great ones this barn
yeah some of these look good again this
image is a slightly different size so
let's just have a look how they look we
may need to resize them manually okay
view our gutter and then I'm just gonna
go back to tab you'll need to copy this
URL to the galleries put the link
address let's call it galleries as well
let's keep it consistent
then I'm just pasting the link there I'm
gonna click publish let's refresh again
so there's that one there's that one so
d is a resize the images for me that's
that's good so they look good if I
wanted them the other way around so pick
up alive I'd like this one to be fair
slider we go back to slider here easiest
way I think to do this is gonna be by
just changing the date and time so it's
not the newest one it's personal so
let's change this galleries once so it's
a bit older if I just change this date
back to July is currently August that's
done that and then if we go back and
refresh number one number two not in a
rude way obviously okay so the homepage
is it's getting there what I want now is
I just want the upcoming events down
down the side here and the news none of
this other stuff because there's too
much of it so back in the dashboard and
then we're gonna go to appearance and
widgets this is the home page one so
there's all this stuff you see this is
what's the fence like to remove stuff
you just go in here and click delete
these all the widgets so I'm just gonna
delete these
dum-dum-dum okay and then here's some of
the ones that we want so I'm gonna get
rid of to otaku the band down Twitter at
the moment they don't have an album even
if your problem and without ones and
things you might wanna use these these
things I just want the events and I just
want our recent posts which I'm just
looking for so they're all over here and
recent bases here so I'm just gonna drag
that up yeah I'm just gonna show them
the last three points it's gonna Colette
news okay so now if we go back refresh
got the upcoming events and got the news
and shape so let's add some events got
our event page here shows where they
were on a nice map and then we've got
all these beds here which are from the
demo content so let's go in and have a
play with them we have a click you can
see what you want I suppose you get so
you get an image you can add a video and
I'll show you some love and a button so
back in the back end and then under
events here's the ones that we just
imported so have a look at these so that
you can see how they work I'm just gonna
delete them so go back to their old site
here we've got the geeks here coming up
they don't have too much information on
their website though so I'm just gonna
have to make up the first one is on 26th
and it was called its birthday party
this is a birthday party I'm cutting
more blow books you would add what you
want and to the venue
a lot Avenue it doesn't have a venue so
let's just call it for an exchange
Bedford a date which was July just
passed anyway so I'm just gonna add it
in the future sometime just for this
example and at a time okay
then we can select the status let's say
it's available you can add a button I'm
gonna say Brooke tickets then you can
add if you if you're using like a ticket
oh you can see or whatever you can add
and the URL in here I'm not so I'm just
gonna put the URL of the contact page
there's no live streaming available and
then you can add map here Corn Exchange
that's it there we go like that
that's how you add an event one last
thing that we need to do is add a
picture let's set featured image I'm
just gonna pick a random banned photo do
you see if you've got a poster or
anything like that that would make a
good image for these elements and then
publish if we go back and have a look on
here there is our upcoming event
there we go perfect so I'm going to add
a few more events just to fill out the
site a little bit and what I'll do is
I'll do one more with you now and then
I'll just quickly do them without
recording just to save a bit of time
let's just do one more while we and just
to take you for it one more time so the
next one on their website is the
Foresters in Bedford on the 9th of
August so which is already gone again
that's so nice I'm gonna set it into the
future
oh no let's set one in the past so you
can see that the past events show as
well so um this is just called a pub
geek I am not very good at typing when
my microphone is just here right front
so that's that's pretty why I can't I
play so a fun gig in the pub Squire it's
quite a British thing so the venue is
called foresters that's the name of the
pub the location is pet food again date
was the 9th which was on Saturdays just
gone so I'm nine o'clock again they say
it's sold out so then there's no button
available
I don't know if this Google Maps gonna
find it lazy typing
oh I accidentally saved it then I'm
pressing return let's try again click
the button right down pressure then
there we go it's put it out there
somewhere I'm not sure if that's right
but we'll go with that
that's sa yeah another image that's
happy old shout Yvonne that as good
doesn't it
okay so let's go back to the website now
it shouldn't appear on the homepage
because it's a past event but if we
could go into events here we've got
upcoming events and then there is the
past event sold out okay so I'm just
gonna add just a handful more events
just in the background so that you know
the website fills out a little bit more
and then we'll go on to adding some
galleries and checking news the about
hours the contact page and also just
finishing everything off so that it's
better so I'll see you in a second okay
so I've added some events so we've got
our events page here and it's got this
annoying map on it which is fine if you
want it keep it but I don't want to use
it because most hits I'm adding for this
particular band they're all in the same
location anyway and it doesn't really
really work so to turn this map off
we'll go into the dashboard again and
then I'm going to go to appearance and
theme settings and then all we need to
do is go down to event options and then
I'm just going to untick show events
get back and refresh
there we go it's gone so let's move on
to the other galleries at the moment
there is I'll see just some sample
images which are just just white things
so let's add a few images so I can just
take you through it so I'm gonna go back
into the dashboard are there and got
galleries here we go into galleries
there's all the current galleries this
just delete those because you don't need
them but if you want to know check them
out have a look and then I'm gonna click
add new to create a new one and let's
just call this one I'm gonna do them by
year so this one was 2013 and it's a I'm
gonna add a new gallery category here I
don't want any of those just call it a
gig gigs okay then we can set a featured
image so this is going to be the main
image that shows ya upload some files
from my computer or a file for now
here's I've got so actually I've got
some collections here oh let's go for
this one the barns okay so it's going to
pick the first one as the featured image
yes all of them do it by year let's call
it the barns and do it by by gigs that
makes more sense doesn't it you can
obviously do however you want you could
do by years you could do by location or
events but I'm thinking that online site
events is it's better so the venue was
the barns Bedford right you can have
captions if you want for each image I'm
not gonna bother so I'm just gonna click
here to add the images and it's just
loading up so I'm gonna click Add to
gallery then I'm gonna upload the rest
of the files so these three here so
they've all got a tick Nixon I'm gonna
take this one as well which was the
featured images to include that too so
I've got the four photos there I'm gonna
click Add to gallery you can set a link
to them if you want I think it needs to
be media file and number of columns and
a random order let's have a look how
that looks so I'm gonna click publish
then of view
here they are then if you click they
come up okay so there's a picture and
obviously our pictures even our photos
and that'll be displayed under galleries
and there's buns so let's just add add
one more to to fill it out so I'm gonna
go up here and do it this way new
gallery item
okay and then mall will give this one
name I think this one is Danny's bar so
the the venue Danny's bar in Bedford
again and we're gonna add some images
think if you Adam here first actually
and then you will need to already be
there when you go to your featured image
Orion does really matter it's up to you
whichever way so let's add these from
the computer Danny bar okay it's quite a
few on this one let's just grab the lot
a lot voting off see it depends on how
fast year internet he's off that boat
down twice look that does happen with
WordPress yeah image galleries can get
in avonlea just started and mine already
getting in a mess but they can get a
little bit out of hand you can obviously
tidy them all up if you want but you
gotta be careful to delete images
because they obviously might be linked
from other pages so make sure you got
plenty of space with your hosting nasaw
like I recommend okay so they're all
there I'll click and again this needs to
be media file oh let's try on attachment
page and just see what happens let's set
the featured image that's a good one
isn't it geeks again
that's view oh it works anyway okay so
it doesn't matter if it's on attachment
page or media item does make any
difference there we go so that's our
photo galleries done um there's another
area that actually that I think we
should add which I haven't added which
is the videos page so let's add it to
the menu so if you remember the menus we
can access them this way through here
but if you already in the dashboard it's
under appearance and then menus and this
videos page was already created and when
we added the demo content so it's there
I'm gonna add that next to galleries and
this basically if you've got any YouTube
videos or Vimeo Vimeo bomyeo Vimeo
videos you can add them to your website
so I was playing around with it just a
minute ago while I wasn't recorded or
recording even and there's some already
added as part of the demo content but
basically what you need to do is click
add new find your video on YouTube all
got YouTube open here so I just did
search for the band and luckily they've
got some some videos on YouTube so I you
know had a look at these ones now what
you're gonna need is a thumbnail so that
really depends on if you're using a PC
or Mac the way I do it on my Mac here is
I just simply open up the video on
YouTube like this there's a bit of video
there look and I kind of pulls it where
I want it so let's go forward a bit I
don't know if this isn't a great video
but wherever you want it and then what I
do is I press shift ctrl command 4 on
the Mac and it brings up all together
that is quite a lot of buttons to press
at once but it brings up this kind of
captured thing I'm sure there's a way to
do it on the PC just google it and then
I just grabbed it like that and then I
paste it and I'll save it as a file and
then we paste it into I'm using Adobe
fireworks but you could use paint or I
think pretty cute is paste it on your
desktop I'm guessing and and then I just
upload that as the
now the thumbnail is the image that is
displayed before the videos played so
let me show you will do it for this one
um what I'll do is I'll just open up
this so here's the fun mode so if I
paste now see it's added it to this
thing I can even go new any document so
I can show you as a freshman and then
I'm going to paste again it's in my
clipboard and there it is and I I'll
just save this as as the thumbnail file
so you are going to be fun nails for
your video so we know which one it is
you're gonna need some if you're gonna
add the videos to the site so yeah let's
save this I've done a few others as well
so we can add a couple so this video is
vintage stuff just a little bit
Undertaker's cover I'm just going to
copy and paste it straight from YouTube
then I'm gonna get the the link which is
up here and just paste that I'm gonna
take the live sets category of course
you can add whatever categories you want
now the featured image is the thumbnail
so I'm just gonna upload that file now
which I saved into video thumbs I hope
I'm not going too quick I've decided
that on the pace of my videos I'm gonna
go a little bit faster I'd love to hear
in the comments if I'm going too quick
or too slow for not covering anything in
much detail but I feel you can keep up
your website it's coming along nicely ok
so that's a bit let's have a look ok
that doesn't work because that's not how
the website works but if we go to the
videos page here they are now there's
one I added earlier without a thumbnail
but there's the one that we just added
here vintage stuff and take a cover and
if you click play the video pops up so
what I'll do is I'll just sort this out
and add a couple more and get rid of all
these demo ones and I'll be back with
you in a sec
okay so I've added a few more videos
from YouTube I am obviously got loads
more to add if I wanted to but let's
crack on so the next section we're going
to have a look at is the the new section
which is the in the next page long so
the new section basically brings in your
latest blog posts so there's some demo
ones here including this hello world
which doesn't have a picture which is
why that one looks a bit weird what
others I'll show you how you could add a
blog post so one way is to go new post
but you can also do it via posts in the
backend posts and add new and let's just
call this this is a test proposed by WP
eagle and then here is where you'd add
some dummy text sort of dummy text you
know that kind of stuff and then you can
just you know add categories so it could
be you know banned news it could be gig
information geek right up but whatever
categories you want and then there's a
few options you can change the color
scheme if you want to have a different
color scheme which we'll get onto in a
bit actually in terms of changing the
colors on the on the site if you want to
do that and then here you can add a an
original you can use one the original
I've got here will published and have a
look so it looks like so blogging is
pretty straightforward I think you'll be
able to work your way around there I've
got some other videos on my channel
about posts and things like that if you
learn a bit more so there's the the post
looking good and people can leave a
comment and and things like you so well
I I mentioned it let's go and have a
look at our colors so we're going to go
back to the dashboard now this theme
comes with a number of different styles
and but obviously you can change cosmos
one so I'm going to go to appearance
theme settings
and then we've got a few options here so
you've got display options and which is
how you set whether it's responsive if I
recommend you leave it on basically that
means it will change the shape depending
on whether it's on a phone or a tablet
and there's a few other bits and bobs
here
which are fine but in terms of colors
let's go to color options and there's a
number of different schemes here so you
know something who into white orange and
say the changes and I get back and
refresh it looks like this is white and
orange so it's got a completely
different feel to it now I kind of like
the black one but there's a there's a
whole over ones you can choose from so
that's you know white purple yeah it's
nice
real nice so let's go back to the
default one from now cuz I think you
know this kind of band it's dark I needs
a bit of a darker feel they wear black
so I think it fits better okay but if
you wanted to change it beyond there you
could forgive you could change the
background so you could set a different
background color let's you know let's go
for green that looks like
that looks pretty horrendous doesn't it
but you can you know you can play around
you could remove that image as well but
I'm gonna leave it as it is for now if
you want to take it even further than
that then you're gonna need to do some
custom CSS and again you'll want to look
up some videos on my channel on how to
do that with Firebug and but that's a
quite a bit more advanced than where
we're gonna get to today okay so let's
get back to the site and see what's left
I'm gonna refresh hopefully that's come
back to the black background okay so the
next page is about so to see the about
Us page so we can edit this text add an
image and I think I'm gonna turn off the
comments on here so to do that we're
gonna click Edit Page that's my stomach
rumbling there hopefully yeah you can't
hear that okay and so there's some text
here I'm gonna bring up the the band's
website again actually just so I can
copy and paste some information easier
to meet just putting gobbledygook into
the site and lorem ipsum okay so they
must have a page here let's see what's
on the members page
okay let's put the set list I'm just
going to copy and paste all this text is
our set list look at the band today no
I've just pasted that without doing the
special like I mentioned earlier and you
see it's bought and all the colors of
stuff that will pretty mess up site so
I'm just going to undo that
I'm gonna go edit paste a match style
now you can obviously change the style
as you see fit
there's kind of standard word like
options here so you can you know make
things bold you can align this centrally
you know I like that Center and I think
we can set a featured image so let's
just find another image of good that
looks like
okay there we go
that's our about page okay I still got
the comments so let's turn that off you
can turn off comments on a page-by-page
basis so that you can decide whether you
want hill it's better you know leave a
comment about your content you can also
turn them off on a site-wide basis as
well just in your settings okay so I'm
going to click edit page and then
there's the option I can't see at the
moment so if you can't see some of the
options up here under screen options you
can turn on and off things that you
might find useful so and that is going
online earning,make money online, earn money online, online earning, online earning sites,
make money online free, online money income, earn money online free, money online, best way to earn money online, online income site, money earning websites, best online earning sites, easiest way to earn money online, earn money payment bkash, online money income site
No comments:
Post a Comment