Support » Theme: Spun » changeing cirlcles into hearts/diamonds

  • Resolved reddbonetv

    (@reddbonetv)


    hello, i have a few things i need help with.

    A. im trying to change the circles in this theme to hearts and diamond shapes but i have no idea where to start, im new to this and this is my first site im building on my own so bare with me. i have a child theme in place already, can someone help me please?

    this is the site i found the shapes on: CSS Shapes

    i would like them the heart and cut diamond shape, like one heart then one diamond and so on.

    here is my site: my site

    B. how do i center header and make it fit a larger image, like a banner size.

    C. how do i make width of page smaller and add a background?

    D. how do i make the words only appear over the circles when hovered on?

Viewing 15 replies - 1 through 15 (of 21 total)
  • Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    The easiest option you have to change the shapes is to create an image of the shape, then apply that through a background to each <article> element.

    can you please explain in detail what you mean … as i stated above im new to this so your speaking in tongues to me right now. lol thanks it will be much appreciated.

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    Which part are you stuck with, creating the image?

    yes, do you mean like edit the photo with photoshop into a heart/diamond shape? and when you say “apply that through a background to each <article> element.” what do you mean?

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    do you mean like edit the photo with photoshop into a heart/diamond shape?

    Yeah create them at a ratio of 360×360 so that they can be increased in size if necessary without turning pixelated (in case someone increases the text size).

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    Once you’ve made the images create an “img” folder in your Child Theme and put your images in there.

    Then you can reference them in your Child Theme style.css file, e.g:

    .hentry.no-thumbnail {
     background: url(img/heart.png) no-repeat;
     background-size: cover;
    }

    okay so i’ve made the image into the desired shape and i made a image.php file in my child theme.

    now i’ve copied and paste the code you gave me above but nothing happened… im i suppose to add something else?

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    The above code was an example.
    Are you sure you mean you created a image.php file?

    yes i created a image.php file in my child theme.

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    The image should be of a file type of “png”, “jpg” or “gif”, and not “php”.

    That image should go in your Child Theme, in a folder named “img” (create that folder if you haven’t it).

    yes, that’s what i meant sorry about that, i made a png image file and made a image.php folder in my child theme. or is it just img?

    Moderator Andrew Nevins

    (@anevins)

    Forum moderator

    or is it just img?

    It’s this.

    The folder should be named “img”.

    ok i’ve done that … what code would i use to change the circles into hearts and diamonds?

    i figure it out. ( :

    i figured it out but the only thing is wrong is the heart doesn’t not hold the whole shape… any tweak i can add?

Viewing 15 replies - 1 through 15 (of 21 total)
  • The topic ‘changeing cirlcles into hearts/diamonds’ is closed to new replies.