WordPress.org

Ready to get started?Download WordPress

Forums

Spun
Spun Theme Circle Shapes to Hexagon? (12 posts)

  1. ksteven6
    Member
    Posted 9 months ago #

    Hello,
    I'm interested in making the circles in the spun theme into hexagons, I tried looking at tutorials like this: http://jtauber.github.io/articles/css-hexagon.html

    but I just can't get it to work. I have a child theme but am pretty new to everything. Any help would be appreciated!

  2. Andrew
    Forum Moderator
    Posted 9 months ago #

    You see that tutorial for the hexagon bit, it's not properly explained.
    The CSS has 3 sections that apply to different elements.

    BTW this method of using borders probably won't work when there are images inside of the circles.

  3. Andrew
    Forum Moderator
    Posted 9 months ago #

    This is a cleaner way to do this http://cssdesk.com/jqWCQ . That way you don't have to touch the HTML and compromise on accessibility & SEO.

    You may have to do these styles twice, one for desktop and another for mobile when the circles get smaller.

  4. Andrew
    Forum Moderator
    Posted 9 months ago #

    Quick demo: http://snag.gy/ytHxe.jpg

    It can be done, but you'll need to override more CSS.

    Let us know how you get on.

  5. ksteven6
    Member
    Posted 8 months ago #

    Hi there,

    Thank you so much for writing to explain this. I just have a question of where I would put the html? Would this go in Functions.php?

    Then I can paste the css into the css document? Thank you!

  6. carozu@hotmail.com
    Member
    Posted 8 months ago #

    Hello, I have the same question but would like a slightly different hexagon shape. I have a child theme but don't know much so I'm also using a CSS plugin. What do you mean by overriding more CSS? Thanks!

  7. carozu@hotmail.com
    Member
    Posted 8 months ago #

    btw, my website is http://www.thehoneyco.com and the hexagon shape I'm talking about is similar to the logo. Could that be done? Thanks again!

  8. Andrew
    Forum Moderator
    Posted 8 months ago #

    Hi carozu, we're happy to look into your request and we ask that you create a new thread to discuss it.

    Meanwhile you can follow the support given to @ksteven6 in this thread.

  9. Andrew
    Forum Moderator
    Posted 8 months ago #

    I just have a question of where I would put the html?

    You don't need to touch the HTML.

    Would this go in Functions.php?

    You don't need to touch the PHP.

    Then I can paste the css into the css document?

    Do you have a "Custom CSS" (or similarly named) plugin, or are you using a Child Theme?

  10. Andrew
    Forum Moderator
    Posted 8 months ago #

    @ksteven6, just saw that you said you do have a Child Theme - Could you link your site?

  11. ksteven6
    Member
    Posted 8 months ago #

    Hi Andrew,
    I have tried a few different times but haven't been successful yet. Here is the website that I am working on:

    http://gubbasbees.com

  12. Andrew
    Forum Moderator
    Posted 6 months ago #

    The easiest option you have is to create hexagon images and assign the circles to have that image as a CSS background:
    http://www.w3schools.com/cssref/pr_background-image.asp

Reply

You must log in to post.

About this Theme

About this Topic