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

brandon

Circle Member
  • Content Count

    2,136
  • Joined

  • Last visited

  • Days Won

    29

Everything posted by brandon

  1. This can be quite complicated when one considers all the combinations of desktop vs. mobile, announcement bar or not, closing of the announcement bar, changes to screen-width/orientation, and more. This question has come up in this forum repeatedly and, in order solve all the various permutations, I created Fixit, a plugin for fixed headers and navigation in Brine (and the Brine/Wright family of templates). You can see the full answer to the related question here. Hope it helps!
  2. Hi @levitatelondon. Take note that the code is out of date and I believe it's actually causing an error on your website (you can open the browser console using dev. tools [F12 or CTRL+SHIFT+I] to see it. I appreciate the kind words though. Your words along with the fact that the old code is causing an error on your site finally motivated me to go back and address this properly, create a 'plugin', and update my answer.
  3. I've actually created a plugin that adds h4, h5, h6 to the Squarespace text editor as an alternative to using a markdown block or code block, so that you can simply add headings along with the rest of your text (without adding extra gaps). To style any h4, h5, or h6 headings you add (whether via code block, markdown block or the Squint plugin), you'll need to add the styles via the CSS Editor in order to customize them. Like this, for example: h4 { font-family: "Times New Roman", Times, serif; font-weight: 300; font-size: 26px; line-height: 1.4em; color: #404040; } h5 { font-family: "Times New Roman", Times, serif; font-weight: 300; font-size: 22px; line-height: 1.4em; color: #404040; } h6 { font-family: "Times New Roman", Times, serif; font-weight: 300; font-size: 19px; line-height: 1.4em; color: #404040; } The above is of course just an example; you'd set your own styles according to your preferences. Regarding the font-family rules, if your font has spaces in the name, surround it with quotes, otherwise, no need for quotes. Also, there is no need for parenthesis around the values, which you might think based on the first answer above. -Brandon Project Mgr. and Developer at Ignertia Creator of Squint - H4, H5, H6 & Custom Styles for Squarespace
  4. I've actually created a plugin that adds h4, h5, h6 to the Squarespace text editor. So it can be done. The Advanced version also allows for additional headings, custom styles, superscript, subscript, underline and more. -Brandon Project Mgr. and Developer at Ignertia Creator of Squint - H4, H5, H6 & Custom Styles for Squarespace
  5. Another option, if you need to target text within a paragraph ( p element) is to try Squint, a plugin I created for Squarespace that allows for custom styles, more headings, superscript, subscript, underline and more. You can select a single word (like this), a sentence, or whatever - like you'd expect with most WYSIWYG editors. -Brandon
  6. I've created Squint, a plugin for Squarespace that allows for custom styles, colors, more headings, superscript, subscript, underline and more. You can select a single word (like this), a sentence, or whatever - like you'd expect with most WYSIWYG editors. So checkout Squint if this is something to do often. -Brandon
  7. I've created Squint, a plugin for Squarespace that allows for custom styles, more headings, superscript, subscript, underline and more. You can select a single word in the middle a sentence, a list item, a paragraph, or whatever - like you'd expect with most WYSIWYG editors. So if it's something you're doing fairly often, or you don't want to have to work within a markdown or code block, it's another option. -Brandon
  8. Paul's answer works well. In addition, if it's something you use often and require the style to be in-line with the rest of your text, I've created a plugin for Squarespace that allows for superscript, subscript and more. See Squint. -Brandon Project Mgr. and Developer at Ignertia Creator of Squint - Custom Text Styles & Headings for the Squarespace Text Editor
  9. For others who may have a similar issue, the solution for mobile would be to simply add an additional selector to target the mobile logo in addition to the full-width logo.
  10. It will depend on the template. Perhaps try asking a new question and including a link to the site/page in question. -Brandon Project Mgr. and Developer at Ignertia Creator of Squint - Custom Text Styles & Classes for the Squarespace Text Editor
  11. I've actually created a plugin that adds h4, h5, h6 to the Squarespace text editor. This is an alternative to using a markdown block or code block, so that you can simply add headings along with the rest of your text (without adding extra gaps). The Advanced version also allows for additional headings, custom styles, superscript, subscript, underline and more. Now, with the headings added to the 'format' dropdown, you'll need to add the styles via the CSS Editor in order to customize them. Like this, for example: h4 { font-size: 30px; color: #CCCCCC; } h5 { font-size: 40px; color: #BBBBBB; } h6 { font-size: 50px; color: #DDDDDD; } -Brandon Project Mgr. and Developer at Ignertia Creator of Squint - H4, H5, H6 & Custom Styles for Squarespace
  12. Yeah, you got it now. I attached an image to my original answer for clarification for others. If this answer worked for you, please mark it accepted. -Brandon
  13. If you provide a link to the page in question, I am happy to demonstrate via screenshot. In general, however, the block-IDs are present, or you can use the Chrome extension mentioned in one of the links mentioned.
  14. Hi @Therzo . IDs starting with yui will be dynamically generated on each page load and (as you observed) change accordingly. However, IDs starting with block-.... do not change. So as long as you don't delete the block and replace it with another, CSS targeted by block should continue to work. Here are a couple loosely related threads that may have additional helpful information: https://answers.squarespace.com/questions/140670/background-image-bedford-how-to-code.html https://answers.squarespace.com/questions/47192/feature-request-ability-to-assign-custom-css-classes-and-ids-when-authoring-content.html So, use the block-.... IDs instead. Do let me know if this works for you. -Brandon If this or any other answer solves the problem, please give credit where credit is due: Accept the answer. Code is provided without any warranty, expressed or implied.
  15. angelawang0524: I did take a look at your site, but your layout is very sporadic. What I mean is, the manner in which you have each row layed out is sporadic, such that there is little common pattern. In some cases, you have spacer blocks, others, not. In some cases you have rows inside rows, others not. So it's too difficult to write rules for any pattern. This happens when dragging-and-dropping in layout engine...it can result in a layout that looks like you want it but is in fact quite messy. Unfortunately that's the case here, so I can't seem to write reliable rules for your situation.
  16. It's probably better to post a new questions with a link to the page. Code like that can be very specific and is not always practical in certain situations. aarnaa's was a simple use case.
  17. Hmmm. The code as you have it should work (it does in my tests). I will note that the page you're linking to requires Flash. If you visit the page directly in your browser (copy/paste the link into a new tab), can you view it? http://relive.co.nz/customers/mikepero/38KoniniStreet/index.html
  18. Hi. The following Javascript, inserted via footer code injection should do the trick: <script> (function() { var prices = document.getElementsByClassName('sqs-money-native'); var thisPrice; var i, I; for (i=0, I=prices.length; i<I; i++) { thisPrice = prices[i]; thisPrice.innerHTML = thisPrice.innerHTML.replace(/(\.[0-9]*?)0+$/, "$1").replace(/\.$/, ""); //http://stackoverflow.com/questions/1015402/1015434#1015434 } })(); </script> I didn't test this throughout your site...just checked a couple pages. 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.
  19. Hi .While not necessary, a link to a page on your site that shows the elements you'd like changed may help others offer help.
  20. Good point. I updated my answer accordingly. A small clarification: I believe Javascript will be loaded and executed as it is encountered unless defer and/or async are used (which prompted me to add window.onload... for head injection...TY). However, I may just be misunderstanding the first part of your second sentence.
  21. 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.
  22. 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. var head = document.getElementsByTagName('head')[0]; alert('Custom javascript will run here.'); } }; </script> Just to be thorough, the above code could also be added to the footer injection as such: <script> (function() { var homeBody = document.getElementById('collection-56d73ffc859fd045d0337663'); if (homeBody) { //Do stuff here. This will only run on the specific page. var head = document.getElementsByTagName('head')[0]; alert('Custom javascript will run here.'); } })(); </script> And to Octopus' point, you could simply insert the script into a specific page's header injection, and figure the difference between being in the head and first in the body is inconsequential. That's probably a safe assumption, accepting the fact that placing script elements at the top of the body element is a bit unconventional. (Ref. 1, Ref 2). 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.
  23. 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 site/page)?
×
×
  • Create New...