{"id":2962,"date":"2013-11-12T17:46:23","date_gmt":"2013-11-12T17:46:23","guid":{"rendered":"https:\/\/www.inmotionhosting.com\/support\/2013\/11\/12\/editing-styles-in-the-cherry-framework\/"},"modified":"2023-06-09T09:38:53","modified_gmt":"2023-06-09T13:38:53","slug":"editing-styles-in-the-cherry-framework","status":"publish","type":"post","link":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/editing-styles-in-the-cherry-framework\/","title":{"rendered":"Editing styles in the Cherry Framework"},"content":{"rendered":"

In this article, we will teach you how to adjust many styling options within the Cherry Framework which is used by many free and premium themes, such as those made by Template Monster. At the end of this tutorial, you will be able to make changes to many options such as fonts and background colors.<\/p>\n

Installing the Cherry Framework<\/h2>\n

Installing the Cherry Framework is quite simple. In fact, it is just as easy as installing any other theme on WordPress<\/a>. In the next steps, we will walk you through fully installing the Cherry Framework as well as activating it on your WordPress site.<\/p>\n

    \n
  1. \"\"<\/a>\n
    <\/div>\n

    First, you will need to download the Cherry Framework. This can be done directly from the official Cherry Framework website<\/a>. Simply visit the site, and click the download button directly in the middle to begin your download. Be sure to save it to a place you will remember as you will need this file later.<\/p><\/li>\n

  2. \"WordPress<\/a>\n
    <\/div>\n

    Next, log into your WordPress dashboard.<\/p><\/li>\n

  3. \"Upload<\/a>\n
    <\/div>\n

    After you are logged into your WordPress dashboard, click on Appearance, then Themes. On the Themes page, click on the Install tab. Here, you will be presented with a search box. As the Cherry Framework is not available on the WordPress theme directory, you will not be able to search for it. Instead, click on the Upload link right above that search box. From here, click on Browse and locate the Cherry Framework theme file that you previously downloaded and press Install Now.<\/p><\/li>\n

  4. \"Theme<\/a>\n
    <\/div>\n

    WordPress will then handle the full installation of the Cherry Framework. After it is installed, you may activate it or begin installing any child themes that you may be using which require the Cherry Framework.<\/p><\/li>\n<\/ol>\n

    Changing background styling in the Cherry Framework<\/h2>\n

    \"General<\/a><\/p>\n

    <\/div>\n

    To change any background using the Cherry Framework, you may simply click on Cherry Options to the right side of the WordPress dashboard. After doing so, you will be automatically taken to the General tab. In here, you will see an option for Body Styling. This option will allow you to wither change the background to a specifically designated color, or upload an image that you would like displayed as the background image.<\/p>\n

    <\/div>\n

    \"body<\/a><\/p>\n

    <\/div>\n

    To set the color, simply click the small color box to the left side of this field and choose the color that you want. You may also enter the hexidecimal color code into the first field as well to se it.<\/p>\n

    <\/div>\n

    \"Add<\/a><\/p>\n

    <\/div>\n

    If you want to set an image for the background, just click on the Upload button to the right of the Body Styling section. You may then browse for an image to set.<\/p>\n

    <\/div>\n

    Once you are done making any changes, click on Save Options to the bottom of the page.<\/p>\n

    Changing header styling in the Cherry Framework<\/h2>\n

    \"change<\/a><\/p>\n

    <\/div>\n

    The header styling options are done in the same way that the body styling changes are made. Simply select your header styling using the section labeled Header Styling.<\/p>\n

    <\/div>\n

    Once those changes are made, be sure to click on Save Options on the bottom of the page.<\/p>\n

    Changing link colors in the Cherry Framework<\/h2>\n

    \"change<\/a><\/p>\n

    <\/div>\n

    To change any colors of links, including the color when a user hovers over them, you may click on Cherry Options to the left side navigation bar in the WordPress dashboard, then click on the General Tab. From here, you will see two options labeled as Link color<\/em> and Link color hover<\/em>. Both of these options change exactly what they are labeled as. To pick a color, you may click on the box to the left and use the color picker to find a color that you like for each. If you have the hexidecimal color that you want, you may enter it into the text field there as well.<\/p>\n

    <\/div>\n

    Once changed, be sure to click on Save Options<\/em> once done to make sure that your changes take effect.<\/p>\n

    Changing font options in the Cherry Framework<\/h2>\n

    \"font<\/a><\/p>\n

    <\/div>\n

    Just as background content and links can be changed, all text on your site can easily be changed on the fly quite easily when using the Cherry Framework for your theme. Under the Body Text<\/em> section, you will see various options such as Font Size, Line Height, Font Face, Font Style, Character Sets, and Color. All of these options allow you to make any changes to your theme for any normal paragraph content that is displayed.<\/p>\n

    <\/div>\n

    You will see many other options such as H1, H2, H3, etc. as well. These are used to make changes to any headings that you may have defined such as an article title or a particular section of a page.<\/p>\n

    If you are unfamiliar with these various options under each font, we will go over each of these options:<\/p>\n