Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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.
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!
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!
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!
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
@ksteven6, just saw that you said you do have a Child Theme – Could you link your site?
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
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
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