way
hi
this is John from PSD dude and in this
video I would like to show you a
wordpress plugin that makes it very easy
to design brass
directly in your wordpress posts and
pages you can get this
WordPress plugin on cold Canyon by
following the link that they posted in
the description of this video let's see
what this
like intended as you can see this plugin
allows you to create
%uh several times of grass
in your room where Press posts now regis
including pie charts
dont charts bar charts state bar charts
line charts and a special kind of charts
which creates charts from images in this
video I'll
only going to detail on how to use this
plugin to create
bar charts and dots let's see what this
plugin can do
for this have set up a demo environment
which is freely accessible
i'm looking in with the democrat then
shows
and then I'm takin to the WordPress
dashboard
this plugin allows me to at charts and
graphs to
posts or pages let's create a new post
the plugin added the the new bottom
in the added post screen this button
below me too
at chars inside the posts let's create a
post
I'll call its by
charts are delicious alright
and then let's say I once to and a new
by chart I click on the bottom
and I get this screen this green
allows me to add several types of for
charge but as I mentioned this video in
this video a lonely go into detail on
how to
ads by charts and ons so let's livid
this this plugin is a
visual designer for charts and graphs
the visual designer has
to parts it has a preview part
on the left hand side of the screen and
it has a setting sparked
on the right hand side of the screen the
preview allows me to
you in real time the changes that they
make into the settings
also you'll notice here that I have
a control for choosing the
zoom level and bridge I'm the reviewing
the chart
and I can use these to this
better see the chart in case the chart
goes
over the size of the screen in the
settings side
the settings are grouped into three
categories:
General Settings text settings and
date let's see the General Settings
as you can see I have here at the size
the chart we takin change by changing
the with
and height let's say I want to make the
chart 400 by four hundred
as good as he immediately in the preview
part to chart
changed alright a
then I have banding I can say
I want 20 pixels padding
and you can see that the padding around
the chart has changed
also I can choose the type of a chart
whether it's a pie chart or adopt let's
make it
a pie chart next setting
he's a starter the start and allows me
to said where the pie chart will start
drawing the slices in the by chart let's
say I want
up minus ninety degree
stop them next
there's the the highlight old there are
three highlight molds
that I can set for the pie chart one is
that the falls
highlight mold and you can see that
these
default Highland Mall means that the
when I go with my mouse
or a slice the slice slight the
changes column there's also
the ball highlight moment which
pope's each slice while I go with my
mouse ovary
and those the border the border
withdrawal
a small border next the slice that time
on currency hope for in with my mom's
I can also change this the size
the size of the border by modifying it
here
and you can see that the border is now
thicker
let's leave it at four pixels
nice
let's take a look at the text settings
the text settings allows me to change
the settings
of the updates present in the by chart
so for example phones are certain out to
sunseri 16 pixels and white
let's change this because my theme
includes some web forms I'll
the Open Science phones i cant also use
these here so let's say at once
welcome signs and as you can see
immediately that changes reflected
in the preview part I can also use
open songs line because
there a bit thinner so it looks a bit
better
the the size of the font I can also
change here
let's make it a little larger
let's say I want to make it 20 and I can
change the
caller of the phones
I was livid white from now next setting
is the decimal settings this allows me
to
decide how many decimals
the numbers on the bar chart will have
if I need
to the smallest it would be too if I
don't need any decimals
I'll leave it as is the label tie
denby either percent value
or not the percent is pretty obvious
what it does
value will display the actual value
behind the by John they done
I can also choose non then the
I don't have any labels on the slices
let's live it doesn't value
the last category of the settings
I data this is perhaps the most
important part of
the settings because here you decide
the actual data the chart will display
for example you have
you need me busy the size the label
behind
each slice o for example I can put here
Saints and as you can see
the chart immediately changed then you
have
the numerical data which is grouped into
slices
and you have the name on the supplies
and then the value
and the caller okay so
for the name on the sly is let's say in
that I want to display
the Saiyans for mine
product some Gold Canyon so
let's see I have here charts
grass usual
sign and see
I have 25 states say
have
library I live it up 35
and then I have others another evidence
50 I can't
also ads new slices by pressing
the at slice bottom or I can
remove slices
for a
changing the name on the slices
reflected again
immediately in the chart saying can see
the
2t that to think these days that I have
25 sales for Johnson right official
designer
which is 23 percent the entire
not again also
change the callers for the slices seem
to make greeting
on the column and then
choosing the caller or setting
column from the color picker now
just choose one predefined column also
for
next
slice and the same
lossless
and that's it this is our first pie
chart
now all I have to do is click
inserts and the char will become
part of my post that wasn't a difficult
was it
so now let's see how
this post looks like preview
as you can see I have the post and the
pie chart
interactive with all the settings that
they've
chosen in the and mold as go back
that CIA changed my mind and I don't
want this to be a part chart I wanted to
be
don't just click on it
headed and in the General Settings I can
switch to dont and consistent now let's
preview it
and it's a doughnut chart
good
usually posts have were texts so let's
see how
text with integrated with these chart
so I'm putting in some
lorem ipsum text at saddle sore
title child I'll make it
heading to and let's say
a1 days charts to be
aligned to the right can
and then I want to
move it inside the text it beats
higher alright
to as you can see I integrating the
chart
inside text so it looks more
natural like this let's preview it
and it looks
pretty good all right let's add some
more
Lauren keeps text and then review again
and it looks very good let's see what
other types of charts i cant at
to this post for stolen some test
and then let's say I want me sir
up by chart here
that say I want to make it a point to
her pan
leave the rest as they are
good text settings
and said don't want to display and able
and then today Tom
and inside at some more slices
known as change the colours
and that's and one more slice alright
that's just a bit the bad news to be
more
even
delete this lace alright
and discreet insert and as you can see
the chart is inserted were I'm chose to
insert now if I click Preview
the Chartis
inside the post
so we have our don i chart are quite
chart
and this one what type of chart that you
can create
using the by chart the sectional
this plugin the new show you how to do
that
so I'll go with to the Union
and again clean to
and then %um chart and they did that
doughnut and I go directly to the data
ami'm
now if I remove %uh all the slices
except 1 than what I'm left with his
these other single button to doughnut
chart
we chill displays are
percent like this I can choose an
neutral colour for the background and I
can also change
a bit the text colour to make it more
visible
thats choose black
home & Sons phones
liked me and then make it the big bigger
p more visible I'll get free the
decimals and
let's go into the General Settings and
change in bed
the start angle that did that
minus 100 eighty and as you can see
I can modify
the value from 0 to 100
and it will show me exactly
the slice from the total
exactly according to the value that I
say said here
and I click Insert
and the chart looks like this lets the
a line into on the center of the screen
and if I click
preview
the Chartis inserted in the posters
expect
I hope you enjoy this video and decide
to buy the charts and graphs
what presidential design are
if you have any questions or suggestions
don't hesitate to leave a comment and I
will try to reply as soon as possible
this subscribe to our YouTube channel
and don't miss the videos that they'll
make showing the
other types of charts and graphs that
you can make using this plugin
