In our previous tutorials, we introduced you Yellow Pencil And Tour of its interface. Since time I suppose (if you bought the plugin) that you have already made some small attempts, and want to know concretely what you can do with this tool.

In this tutorial we will introduce you to everything (Or preque) What you can do with Yellow Pencil.

What can you do with Yellow Pencil?

Once you're familiar with the interface, it's time to get started. Here is a sample of the many customization tools this plugin offers. These will help you in building a website .

Change Type

Edit typography of yellow pencil

Choosing an appropriate font for your Website is an important task. Yellow Pencil offers a variety of options to help you personalize your text in a way that matches the design of your Website and grabs your reader's attention.

Click on a section of text you want to edit, then select "Text" from the edit panel. This will bring up customization options for the typography. Choose from over 600 available font types, change font size, change line height, letter and word spacing settings, and many more options. You can also change the color of your text by selecting one of the color palettes that Yellow Pencil offers, or go for your own color choice.

Add a border

How to add a border

Adding a border to certain elements on a page can help highlight important information and create effective visuals. After selecting the image or text on which you want to add a border, select " Border (Border) on the editing panel. There are four styles to choose from.

After selecting the image or text on which you want to add a border, select " Border On the edit panel. There are four styles to choose from as we just said: solid, dotted, " dash Or masked. You can also change the width of the border to make it thinner or more pronounced, and change the color.

An impressive feature is that you can customize each side of the borders separately. This means that each of the four sides can give a different color, style and thickness, resulting in a unique and eye-catching look.

Change background

Change the background image

A striking background can give an effect pop ". Yellow Pencil allows you to change the background of every element on your site.

Use animations

Use animations on yellow pencil

Using animations is another way to help your contents to have an impact. Under “Animation” in the editing panel, you can add an animation effect for a specific element.

Choose from one of 50 animations, zoom, or fade out, bounce, spin, and more. You can control the duration and delay, as well as multiple animations running at the same time, if you want. This will give your site some originality, as well as attention to the important aspects of your page. You can also create your own animations by selecting the animation manager on the toolbar.

To do this, click on the chosen element and select "Context" from the edit panel.

Here you can change the background color, or select one of the Yellow Pencil models. You also have the option to upload your own personalized images. Once you have chosen an image as the background you can adjust the background size, position and if you have added an image you have to choose if it is static or scrolls with the rest of the page .

Resize and Reposition any item

Resizing and repositioning everything is very simple with Yellow Pencil.

To resize, click an element directly so that a highlight border appears. Then simply drag the horizontal and vertical lines of the blue box to change the size.

Customize the size of an item

To reposition an item, click on it, then hold down the mouse button (left button). Drag the item to where you want it to appear.

Moving a yellow pencil element

The downside of this feature is that it can cause issues with display on mobiles. Use the Responsive tool, available in the toolbar, to see how your web page will look on mobile devices. You may need to modify your design accordingly.

Price of Yellow Pencil

Yellow pencil Price

Le WordPress Plugin Yellow Pencil is available on CodeCanyon for $25. This includes 6 months of support, but you have the option to pay an additional $7,88 to extend support to a maximum of 12 months.

If you have any questions, do not hesitate to ask us.