Ashelle
Member-
Posts
25 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by Ashelle
-
Thank you!!
-
Thank you!!
-
Site URL: https://www.myartbeatflorals.com/about So I spent hours perfecting one little section on my site yesterday, to where it would look right in both desktop and mobile view. Got it perfect through sheer luck, because I know nothing about coding. Then I happened to look at the tablet view this morning. Ugh. I need help knowing how to keep the desktop and mobile layouts the way they are, but fix the cut-off title and the uneven color block showing on tablet view. I just know if I go and try to fix it I'm going to screw up what I perfected yesterday. I've attached screeshots of desktop and mobile (which are great), and the changes I need to make on the tablet view. https://crow-grey-dnt6.squarespace.com/config/
-
I figured out #1. I still haven't figured out #2 or #3. The random "}" is sitewide on every page at the very top left. The FAQ page is linked below but there's nothing to screenshot other than the snippet of coding I shared above. Links within my markdown section just don't open in a new window. https://crow-grey-dnt6.squarespace.com/faq
-
Site URL: http://www.myartbeatflorals.com Three things... One is that on mobile view, all pages have words hyphenated due to lack of space. Is there a code I can use to just bump the word down to the next line instead? Second, in my FAQ section I have it set to open my links in a new page, but it doesn't. Here's a snippet of my markdown coding for that: ### • **DO YOU OFFER ANY DISCOUNTS OR PACKAGES?** I offer a 10% photography discount, which you can read about and apply for [here][9]. [8]: https://www.jotform.com/ashellepack/10-photography-discount [9]: https://www.jotform.com/ashellepack/10-photography-discount I do not currently offer package deals. I have found that most couples' needs do not fit any one package. All of my items are priced à la carte, so you can get exactly what you need - no more and no less! <hr> And third, I have a "}" showing up at the top of my site. Not sure how to remove it. Here's my current custom CSS: //subtitle under logo// a.Mobile-bar-branding:after { content: "SOLA WOOD | SILK | PRESERVED"; display: block; margin-top: 20px; font-size: 8px; font-family: futura-pt; color: #A0A0A0; } @media screen and (max-width: 639px){ #pitch { min-height: unset !important; } //remove space at bottom of site on mobile// .Mobile-bar.Mobile-bar--bottom { padding: 0; } /* tagline overlap */ a.Header-tagline { line-height: 1.2em; } } /* Tagline on mobile */ a.Mobile-bar-branding:after { content: "Sola Wood | Artificial | Dried | Preserved"; font-family: futura-pt; font-weight: 700; font-style: normal; font-size: 11px; letter-spacing: .2em; line-height: .5em; text-transform: uppercase; color: rgba(124,121,121,.5); display: block; }
-
And if possible I would prefer the tagline stay all one line and not go to a second line. Not sure if that's what the code is doing or just giving it room for a second line, but if I do that I would think there'd be extra blank space underneath it on the larger screens.
-
That's not doing anything for either view. But my existing coding says that I'm "missing closing '}' ". Could that be preventing other codes from working? I have no idea where another '}' needs to go. Here is my current coding: //subtitle under logo// a.Mobile-bar-branding:after { content: "SOLA WOOD | SILK | PRESERVED"; display: block; margin-top: 20px; font-size: 8px; font-family: futura-pt; color: #A0A0A0; } @media screen and (max-width: 639px){ #pitch { min-height: unset !important; } //remove space at bottom of site on mobile// .Mobile-bar.Mobile-bar--bottom { padding: 0; } /* tagline overlap */ a.Header-tagline { line-height: 1.2em; }
-
Site URL: https://www.myartbeatflorals.com My tagline below my logo is a single line on my large desktop monitor, but on my laptop it's two lines overlapped. And it doesn't show up at all on my iPhone. Any codes to fix this? Please be specific about what I need to put where...I'm limping my way through this code stuff. 🙂
-
Custom font CSS for multiple quote blocks on one page only?
Ashelle replied to Ashelle's topic in Customize with code
I have just gone ahead and picked different fonts for the quote blocks. I feel that it would be a hassle to customize each and every quote I have on that page, especially if I will be switching out quotes periodically. -
Custom font CSS for multiple quote blocks on one page only?
Ashelle replied to Ashelle's topic in Customize with code
Here's what I have: a.Mobile-bar-branding:after { content: "SOLA WOOD | SILK | PRESERVED"; display: block; margin-top: 20px; font-size: 8px; font-family: futura-pt; color: #A0A0A0; } @media screen and (max-width: 639px){ #pitch { min-height: unset !important; } //remove space at bottom of site on mobile// .Mobile-bar.Mobile-bar--bottom { padding: 0; } -
Custom font CSS for multiple quote blocks on one page only?
Ashelle replied to Ashelle's topic in Customize with code
I have seen that, but it just says it needs a closing and I cannot figure out where the closing needs to go. I'm completely ignorant in coding... -
Custom font CSS for multiple quote blocks on one page only?
Ashelle replied to Ashelle's topic in Customize with code
I have only added one quote thus far, but there will be quotes throughout that page in the blank spaces. https://www.myartbeatflorals.com/testimonials -
Site URL: http://www.myartbeatflorals.com Hopefully this is my last question, as my website is basically done: I want to customize my quote fonts only on my Testimonials page. I have a quote already on my home page, which I'd like to stay as is. I have already uploaded the custom fonts, but don't know the CSS code to make it apply exclusively to that one page. I will have several quote blocks on the same page with the same two fonts. I considered making a Word document into a PDF and embedding it, but that puts a gray space around the document and I don't want that. If there's a way to avoid that, it would probably be easiest. Otherwise....For the quoted portion, I want it to be Eras Medium ITC (ErasMediumITC.ttf) in 11 pt. The source, I want to be Ink Free (inkfree.ttf) in 12 pt. I am not picky on animation...anything that looks good with multiple quotes, or none at all. What code would accomplish this? I've attached a photo of how I want the quote to look (the source being indented would be nice, but not necessary).
-
Collapsible FAQ works in editing mode, but not public view
Ashelle replied to Ashelle's topic in Customize with code
Perfect! Thanks so much! -
Collapsible FAQ works in editing mode, but not public view
Ashelle replied to Ashelle's topic in Customize with code
I pasted all that and it didn't seem to change anything. -
Site URL: https://www.myartbeatflorals.com So I have a gallery page with "albums" of various weddings and styled shoots I've done. I want only one main image to be seen initially, and ideally I'd like to be able to click into a larger gallery (where you can see all photos) and then click on each image to view it larger (like a lightbox). Currently I'm using the slideshow view without thumbnails...but the images are so tiny and there's no way to see them all at a glance or zoom in. Any coding or hacks that could get me this look? I see photography pages with it all the time. I'm using the Sonny template. TIA!
-
- gallery-block
- images
-
(and 1 more)
Tagged with:
-
Collapsible FAQ works in editing mode, but not public view
Ashelle replied to Ashelle's topic in Customize with code
-
Collapsible FAQ works in editing mode, but not public view
Ashelle replied to Ashelle's topic in Customize with code
@creedon that worked, thanks! -
Site URL: http://www.myartbeatflorals.com I recently watched a tutorial on how to create a collapsible/accordion FAQ page. Worked great...except I just discovered it does not appear as collapsible when I visit my website as a visitor would...on desktop or mobile. In edit/dashboard mode, it works as it should. Here is the code I used: <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script> $(document).ready(function(){ $('.markdown-block .sqs-block-content h3').css('cursor','pointer'); $(".markdown-block .sqs-block-content h3").nextUntil("h3").slideToggle(); $(".markdown-block .sqs-block-content h3").click(function() {$(this).nextUntil("h3").slideToggle();}); }); </script> And a portion of the customized markdown code I used: ### **HOW LONG WILL IT TAKE FOR MY FLOWERS TO BE MADE?** While this depends on how many items you order, I typically request a minimum of 8 weeks to complete your flowers. My calendar always fills up quickly each month, so the earlier you book, the better! <hr> ### **HOW FAR IN ADVANCE CAN I ORDER MY FLOWERS?** Everything I create is either wood, silk, fabric, dried, or naturally preserved. This means you can order several months in advance without worrying about wilting or decay! Just keep the flowers in a dry, cool place out of moisture and direct sunlight, and your arrangements can last for years! <hr>