adding a gradient as backround (5 posts)

  1. Jojo21
    Posted 2 years ago #

    how can I add a 1 pixel wide gradient below the background image instead of the background color. On top, in the corners, i want to set a small picture. Below this picture there should be a gradient not a monochrome backround. Is there a way to do this?

  2. esmi
    Forum Moderator
    Posted 2 years ago #

    Do not edit the theme itself. First create a child theme for your changes. Or install a custom CSS plugin.

  3. Jojo21
    Posted 2 years ago #

    ok, done. Child theme build and activated. And now?

  4. esmi
    Forum Moderator
    Posted 2 years ago #

    Now try using Firefox with the Firebug add-on to locate the CSS you need to over-write in your child theme. Or use whatever developer tool is available in your web browser.

    If you need to change any markup, you'll need to create a copy of the relevant template file in your child theme and make all changes to that file.

  5. nobita
    Theme Author

    Posted 2 years ago #

    Hi Jojo21

    Thank you for using Raindrops.

    Raindrops has auto gradient class.

    Please try below.

    1. Create post new

    2. Click help tab and click overview

    3. You can see current Raindrops gradient class.

    This gradient related Theme options 'Base color for Automatic Color Arrangement'.
    base color select 'red' then create a red gradient.

    4. using example below
    ( please use editor text mode )

    <div class="gradient-3 pad-m corner" style="display:inline-block">
    <img src="http://example.com/img.jpg" alt="example" />

    class means
    pad-m padding midium
    corner round corner

    style means
    Shrinking Fit for small image

    If you need your original style rule.

    1. Create a custom field name 'css'

    <div class="my-gradient">
    <img src="http://example.com/img.jpg" alt="example" />

    2. value set

    .my-gradient{ /*your rules*/ }

    Thank you.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic