Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Customize Menu Block with Leader Dots


cchs

Question

Site URL: http://www.blackbookbar.com

Hi. 

My site (www.blackbookbar.com) uses CSS to add leader dots between the menu items and prices. To make the menu easier for my client to update, I'd like to use Squarespace's built-in Menu Block feature rather than custom code blocks, but I want to keep the look of the leader dots.

I assume this can be done with a combination of scripting and css but it is well above my knowledge level. 

Any ideas on how to achieve this? Thanks in advance for any help!

Link to comment
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

3 answers to this question

Recommended Posts

  • 0
3 hours ago, cchs said:

Site URL: http://www.blackbookbar.com

Hi. 

My site (www.blackbookbar.com) uses CSS to add leader dots between the menu items and prices. To make the menu easier for my client to update, I'd like to use Squarespace's built-in Menu Block feature rather than custom code blocks, but I want to keep the look of the leader dots.

I assume this can be done with a combination of scripting and css but it is well above my knowledge level. 

Any ideas on how to achieve this? Thanks in advance for any help!

You should create a menu with menu block first so we can have a look, the dots can be achieved using css border

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Portfolio hover Replace Link Style
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
On 7/23/2021 at 12:21 PM, cchs said:

Thanks. If you go to www.blackbookbar.com/drinks you will see an example at the top of the page that uses a code-block to create leader dots.

Below that the beer list is created using Squarespace's menu block.

Can't do the same. You can achieve similar by adding this to Design > Custom CSS

.menu-item {
    border-bottom: 2px dotted white;
    padding-bottom: 10px !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...