-
Posts
64,963 -
Joined
-
Last visited
-
Days Won
517
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by tuanphan
-
Try adding this code to Code Block <nav class="circular-menu"> <div class="circle"> <a href="" class="fa fa-home fa-2x"></a> <a href="" class="fa fa-facebook fa-2x"></a> <a href="" class="fa fa-twitter fa-2x"></a> <a href="" class="fa fa-linkedin fa-2x"></a> <a href="" class="fa fa-github fa-2x"></a> <a href="" class="fa fa-rss fa-2x"></a> <a href="" class="fa fa-pinterest fa-2x"></a> <a href="" class="fa fa-asterisk fa-2x"></a> </div> <a href="" class="menu-button fa fa-bars fa-2x"></a> </nav> <style> .circular-menu { width: 250px; height: 250px; margin: 0 auto; position: relative; } .circle { width: 250px; height: 250px; opacity: 0; -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0); -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .open.circle { opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } .circle a { text-decoration: none; color: white; display: block; height: 40px; width: 40px; line-height: 40px; margin-left: -20px; margin-top: -20px; position: absolute; text-align: center; } .circle a:hover { color: #eef; } .menu-button { position: absolute; top: calc(50% - 30px); left: calc(50% - 30px); text-decoration: none; text-align: center; color: #444; border-radius: 50%; display: block; height: 40px; width: 40px; line-height: 40px; padding: 10px; background: #dde; } .menu-button:hover { background-color: #eef; } </style> <script> // Demo by http://creative-punch.net var items = document.querySelectorAll('.circle a'); for(var i = 0, l = items.length; i < l; i++) { items[i].style.left = (50 - 35*Math.cos(-0.5 * Math.PI - 2*(1/l)*i*Math.PI)).toFixed(4) + "%"; items[i].style.top = (50 + 35*Math.sin(-0.5 * Math.PI - 2*(1/l)*i*Math.PI)).toFixed(4) + "%"; } document.querySelector('.menu-button').onclick = function(e) { e.preventDefault(); document.querySelector('.circle').classList.toggle('open'); } </script>
-
The above code for desktop only, with mobile you can add this code @media screen and (max-width:640px) { .qgiv-embed-container iframe { min-height: 900px !important; } } Adjust number 900
-
How to change image % in image card block (7.1)
tuanphan replied to LaurenZA's topic in Customize with code
Hi. Your site is private. Can you setup password & share url again? -
How to set my mobile site width to 100%
tuanphan replied to lifeislikeabullet's topic in Customize with code
Try adding to Design > Custom CSS html, body {overflow-x:hidden;} -
Do you still need help with Retreats page?
-
Add "continue shopping?" popup after hitting add to cart
tuanphan replied to kyartist's topic in Customize with code
You're welcome. If you have any other problems, just reply to this post/or post new topic -
Have you tried set up Breath page as homepage yet? If this doenn't work, which plan do you use? If business plan, add this code into Breath Page Header <script> window.location.href = "/"; </script>
-
Try adding to Design > Custom CSS @media screen and (max-width:767px) { [data-section-id="607e7dea4ff0a43308d8722f"] { min-height: unset !important; height: 40vh; } }
-
Navigation drop downs and search magnifying glass
tuanphan replied to Faustas's topic in Customize with code
Hi, #1. I don't think you can get all into dropdown menu, especially By Price Range, with other, you can use Categories/Tags + a Mega Menu plugin. #2. With search icon Wich position you want to add it? Beside cart icon or login text? #3. Try WeGlot or this free guide to add 2/3 languages. https://www.bradgood.net/articles/multi-language-content-on-any-squarespace-template- 1 reply
-
- navigation
- homepage
-
(and 2 more)
Tagged with:
-
@rafaelRA If you still haven't solved this, try these code by @creedon
-
How can I force 3 rows on mobile for carousel view?
tuanphan replied to ThisWayToFabulous's topic in Customize with code
Use this new code /* Homepage Mobile Carousel */ @media screen and (max-width:767px) { .user-items-list-item-container[data-section-id="61a3f20b4d0dd626ec6305de"] { ul { grid-template-columns: repeat(3,1fr) !important; } h2 { font-size: 17px !important; } a.list-item-content__button { font-size: 8px !important; }} } -
Banner Image Won't Resize for Mobile View
tuanphan replied to TheIDBootCamp's topic in Fonts, colors and images
Add to Design > Custom CSS /* resize mobile top image */ @media screen and (max-width:640px) { body.homepage .Parallax-item:first-child img { width: 100% !important; height: auto !important; left: 0 !important; top: 0 !important; } }- 509 replies
-
-
Navagation hamburger showing footer content on some pages.
tuanphan replied to Wonderneath's topic in Pages & Content
Add this code to Design > Custom CSS to fix problem div#sidecarNav { z-index: 9999 !important; } -
Not related, but have you tried this free guide to add 2 languages, it will be easier. https://www.bradgood.net/articles/multi-language-content-on-any-squarespace-template
- 1 reply
-
- navigation
- navigation-link
-
(and 2 more)
Tagged with:
-
How do I remove padding from image slideshow?
tuanphan replied to benelkind's topic in Site Design & Styles
Don't remove your code. Add this to Design > custom CSS > Then save & reload the site @media screen and (max-width:767px) { body.homepage .gallery-slideshow { height: 35vh !important; } } -
Henson Index Navigation | Remove Image Hover
tuanphan replied to missmelisxx's topic in Site Design & Styles
Hi, You need to remove both banner on hover?- 5 replies
-
- navigation-link
- henson-template
-
(and 1 more)
Tagged with:
-
Hi, Design > Site Styles >> Adjust their line-height
-
Version 7.1 help needed- different logos on different pages
tuanphan replied to basakatac's topic in Site Design & Styles
You mean Change logo when overlay menu is open (on each page) (screenshot). Is this right? Keep original logo when overlay menu is close.- 15 replies
-
- custom-css
- logo
-
(and 1 more)
Tagged with:
-
In your code, edit this line padding: 0px; to this padding: 0px !important;
-
Pattern background on one section in the index page??
tuanphan replied to Aapo's topic in Site Design & Styles
Add to Design > Custom CSS [data-section-id="61968be61b95d0428debe6c8"] .section-background { background-image: url(https://static1.squarespace.com/static/61968ba483d7c14541409262/t/619fa1922c62ce4f831718e1/1637851538072/Pattern+01.png) !important; } -
Adding a sticky header (navigation) using Wexley the template?
tuanphan replied to iancurcio's topic in Site Design & Styles
Try this new code The code will run on desktop only @media screen and (min-width:901px) { header#header { position: fixed; top: 0; z-index: 999; left: 0; right: 0; padding-top: 60px; padding-left: 60px; padding-right: 60px; background-color: white; } div#pageWrapper { margin-top: 150px; } } -
One Column for Projects on Beaumont Template?
tuanphan replied to VinsonCo's topic in Site Design & Styles
If you share link to project page, we can help easier