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


Circle Member
  • Content Count

  • Joined

  • Last visited

  • Days Won


Everything posted by brandon

  1. Agreed. The developer should weigh this disadvantage against the potential advantage of keeping such code in a single location (site header/footer injection) as opposed to located across multiple pages' header injection points.
  2. Something like this should work. Using your browser's developer tools (F12), locate an element ID or class that is unique to the page you want to target. For example, on the Montauk Demo page, the ID of the body on the home page is collection-56d73ffc859fd045d0337663 . So, to target just that page, you could do something like this, inserted via page head code injection: <script> window.onload = function() { var homeBody = document.getElementById('collection-56d73ffc859fd045d0337663'); if (homeBody) { //Do stuff here. This will only run on a specific page.
  3. You are correct that page header injection puts the code in the body element, not the head element. I guess that's why Squarespace calls it "header" and not "head". It may not be your actual "header" but it does get injected as the first element within the body . Having said that, you can insert code into the head tag using settings > advanced > page header code injection and then write the Javascript such that it will only apply to a specific page. Are you able to provide details regarding the specific code you want to insert and on which page (along with a link to the
  4. @starburst5654: It looks like you've got it sorted. Looking at your site, everything looks in order to me. If that's not the case, let me know.
  5. Hello. Add the following CSS via the CSS Editor: @media only screen and (max-width: 768px) { #block-8fc91e9563250a77172c { display: none; } } Do let me know if this works for you. -Brandon If this or any other answer helps you out, please give credit where credit is due: Accept the answer if you're the poster or Up-Vote the answer if you're not the poster. If it didn't help, feel free to inquire further or wait and see what others have to say. Code is provided without any warranty, expressed or implied.
  6. Nice! Thanks for posting. Side note: I converted your Answer to a Comment (it's easy to accidentally post an answer instead of a comment). Up-voting useful answers is also helpful. Best!
  7. Hey, now we're getting somewhere. See my latest (and hopefully final) update to the answer. I attached another screenshot (samebuttons2.jpg) to the answer so you can preview what it will look like.
  8. No problem. If that doesn't work, I just updated my answer one last time. It also has an image attached that shows the end result.
  9. Yeah, sure. Just combine both answers. In other words, keep the CSS that I gave you (which will match the width), but also use the NEW answer (which will match the height).
  10. FYI: "Height" is the word you are going for. HTML elements are defined in terms of width and height. Length is not as easily understood, and should therefore be avoided in communication of this sort. I updated my answer. Let me know how it works for ya.
  11. It seems I'm not understanding the problem. Here is what I see in the screenshot: Both buttons are the same width. The text "Existing Customers" is on it's own line (within the button) As far as I can tell, that is what you requested. Are you saying you want "Existing Customers" to be outside of the button entirely? Can you explain what else about the screenshot is not right?
  12. Latest Answer: Okay, here's what you want. I attached another image (samebuttons2.jpg) so you can see. .homepage .sqs-block-button-element[href="/pickupdelivery"] { padding-top: 1.75em; padding-bottom: 1.75em; } .homepage .sqs-block-button .sqs-block-button-element--small { width: 100%; max-width: 290px; box-sizing: border-box; } Old Answer #3: - Remove the previous CSS I gave you originally. - Remove the text "(Existing Customers)" from the second button - Do not add another text block below the button. Instead, we'll add the text with CSS so that there won't be a gap
  13. Sorry @FMRF. I should have noticed that you're not the original poster! Of course, you can't accept it if you're not the original poster. Not sure how I missed that...I was going through older questions and must have gotten confused as to who asked what.
  14. Nice! Yeah that'll work too; thanks for letting me know. -Brandon
  15. That's true. When I said "...the simplest thing to do..." I suppose I neglected to consider simply making the table horizontally scrollable. Obviously this has its own disadvantages (as all approaches do) but it does get the job done! -Brandon
  16. No, the element references are specific to Brine (and possibly Brine's related templates).
  17. Hi there. One option is to add the gif as a background image on the image's containing element. When the image loads, it will cover up the gif (although the gif is still there, just not visible). Something like this, added via the CSS Editor, substituting your own gif file: .summary-thumbnail { background-image: url("https://d13yacurqjgara.cloudfront.net/users/82092/screenshots/1073359/spinner.gif"); background-position: center; } Or, here's another option using just CSS: .sqs-block-summary-v2 * { position: relative; z-index: 1; } .summary-thumbnail:after { content: " ";
  18. Ok, I updated the code. It works now. The only problem I see is that this doesn't show the announcement bar on mobile. In order to change that, the code would need to be refactored a bit which would take time. That combined with the fact that the OP never responded means I probably won't get to this.
  19. A few comments: I would change your class "column" to "cell", since that's more accurate. No biggy though. The quest for "responsive tables" is an ambitious one. On mobile, you can only fit a few cells wide and only if the text isn't too long. Here are some solutions that others have come up with to deal with it. I suppose the simplest thing to do would be to add a media query and break the cells into stacking blocks. Like this. @media only screen and (max-width: 860px) { .column { display: block; width: 100%; border-bottom: 1px solid white;
  20. On second thought, Caroline, simply try using the code I provided but instead of "content: NEXT" and "content: PREV" use "content: >" and "content: <".
  21. Hi Caroline. I would post a new question with your description and a link to the page in question. Then you can comment on your question with @BrandonW (case sensitive) and I'll be notified and will try to take a look. It could be that your template requires slightly modified code.
  22. Hi there. Give this a try. Insert the following CSS using the CSS Editor. /*Reorder category list items on Montauk*/ /*http://caniuse.com/flexbox*/ /*http://shouldiprefix.com/#flexbox*/ #collection-5719735837013bf7bb9fc122 .category-nav-links { display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */ display: flex; /* NEW, Spec - Firefox, Chrome, Opera */ -webkit-justify-content: space-around; /* Safari 6.1+ */ justify-content: center; } /*Set the order of each l
  23. Cool man; glad that worked. You deserve some credit for your very clearly articulated question. That makes a big difference when it comes to unique requests.
  • Create New...