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

Search the Community

Showing results for tags 'text'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges


Expert ID

  1. Site URL: https://www.whatadaycollective.com/artists Hello! I'm trying to find a way to display an image over text without success, that's why I'm posting here. The gallery/portfolio features aren't a solution as the text is scattered around the screen for aesthetic purposes. I'm building an artists page, therefore the goal would be to display a picture when hovering over each artist name. This is the page: https://www.whatadaycollective.com/artists Any help would be much appreciated! Thanks :)
  2. Site URL: https://debrarbryson.com/book-reviews Hi Everyone, Is there a way to make the word "It" appear on the same line as "...could be a life saver." on mobile ONLY? It looks fine on desktop, but a little weird on mobile. Perhaps a page break between "...new country." and "It..."? Thank you so much!
  3. Site URL: https://www.imperialcitizenship.squarespace.com password: imperialcitizenship Hi, I need help adjusting the animation of my code. Currently, this animation start at the edge of the screen on the right. However, I want it to start in the center filling up my whole screen then infinitely continuing. How do I adjust the code? Animation starts at the right: What I want, animation starts in the middle and also going out to the far left of the screen: Existing code: //SCROLLING VERTICAL TEXT .vertscroll { margin: 0 auto; white-space: nowrap; overflow: hidden; position: absolute; } .vertscroll span { display: inline-block; padding-left: 100%; animation: vertscroll 60s linear infinite; } .vertscroll2 span { animation-delay: 30s; } @keyframes vertscroll { 0% { transform: translate(0%, 0); } 100% { transform: translate(-100%, 0); } } <h4 class="vertscroll"> <span>Antiqua and Barbuda&emsp;&emsp;Dominica&emsp;&emsp;St. Lucia&emsp;&emsp;St. Kitts and Nevis&emsp;&emsp;Grenad&emsp;&emsp;Cyprus&emsp;&emsp;Malta&emsp;&emsp;Turkey&emsp;&emsp;Vanuatu&emsp;&emsp;Montenegro&emsp;&emsp;Greece&emsp;&emsp;Portugal&emsp;&emsp;</span> </h4> <h4 class="vertscroll vertscroll2"> <span>Antiqua and Barbuda&emsp;&emsp;Dominica&emsp;&emsp;St. Lucia&emsp;&emsp;St. Kitts and Nevis&emsp;&emsp;Grenad&emsp;&emsp;Cyprus&emsp;&emsp;Malta&emsp;&emsp;Turkey&emsp;&emsp;Vanuatu&emsp;&emsp;Montenegro&emsp;&emsp;Greece&emsp;&emsp;Portugal&emsp;&emsp;</span> </h4> Thank you!
  4. Site URL: https://perklending.com I am looking to fix the first section on my site's homepage - in regards to the mobile and tablet versions. There's an H1 title next to 3 image blocks. It looks great on desktop, but not so much on tablet. The h1 text box font size is just way too large when the screen width is smaller. Also, because the font is so large, the words wrap. When the screen width shrinks, I'd like the H1 text box font to shrink accordingly, that way there's never a screen width where the H1 text is broken up (see attached photo for example -tabletprob1). Having such a large font not only causes the words to wrap but leaves a significant amount of white space underneath the photos (because the h1 text box is so large). I have coded that when the screen width gets to a certain point, to make the 3 image blocks disappear entirely. That code is below. The tricky part is that there is a point where the below code kicks in, and the image blocks no longer display, BUT the H1 text box does not adjust to take up the full screen. It looks terrible (see attached tabletproblem2). Eventually, the H1 text box does adjust to take up the entire width of the screen and looks great. To recap, the screen width is causing a 2-part problem I'd love some help with fixing. Part 1 is that the H1 text box font size is just way too big on smaller screens. Part 2 is that once the code below prompts the photos to disappear, the H1 text box is not currently adjusting to take up the full screen. Thank you for all assistance! PASSWORD FOR SITE: hello //HOMEPAGE MOBILE RESIZING //Header photos title 1,2,3 @media only screen and (max-width: 905px) { #block-yui_3_17_2_1_1625930377608_39055 { display: none; } } @media only screen and (max-width: 905px) { #block-yui_3_17_2_1_1625930377608_40459 { display: none; } } @media only screen and (max-width: 905px) { #block-yui_3_17_2_1_1625930377608_29799 { display: none; } }
  5. So I am building a website using the Impact template in the Brine family. I kept much of the original formatting, as it worked well for my client, including the large block header 1 format. However, one of my banner page titles has a word ("recreational") that is too long for the mobile view and getting cut off or wrapped mid-word (I included a screenshot). How do I change the font-size only on this page, and only for the mobile view? I don't want the font-size to change on the full-screen size; and I want the other mobile-view page title font-sizes to remain the same. Site: Recreational Therapy page
  6. Site URL: https://echidna-gardenia-fcb4.squarespace.com I'm using the Pazari template and am looking to remove some of the hover links on select images on the main portfolio page. For example, when you hover over one of the project images, the name of the project appears and this is then clickable (takes you through to a detailed page on this project). I need this feature on some of the images, but for others I want to remove both the text and the clickable link so these appear as a flat image only. Does anyone know if this is possible and how you create custom code for this? Assuming this code will need to apply to each individual image which is uploaded and I'm not sure if you can separate them? Any help on this would be great! Examples below showing how the text appears when you hover over the image and site link is: https://echidna-gardenia-fcb4.squarespace.com Thanks!
  7. Site URL: https://www.madebydot.tv/ @tuanphan My website is https://www.madebydot.tv/ If you have a look at the screenshot, the line spacing of the navigation menu is just so weird at the moment. I'd just like the line spacing between each page on mobile to be the same. Could you please help out? The other thing I was wondering was if I can make the project thumbnails and vimeo videos go full width only for mobile for my website?
  8. Site URL: https://imriagmon.com/ Hello! I'm looking to modify the first image on my homescreen so it would appear wide (full size) on desktop and be cropped to a square on mobile. (exactly as it is on this reference website: www.ezracohen.tv) Right now it's a simple image with text embeded on it but I plan on using an image block poster, so the text would respond to different screen sizes. Is there any css code I can embed to replicate what's seen on the reference? Thank you in advance, Imri
  9. Site URL: http://www.arobertsonphoto.com/blog Hey y'all! I really hate how the blog titles appear on my blog page - here I want to make the text smaller so that this weird overlap doesn't happen. Anyone have any ideas?
  10. Site URL: http://www.greenimpactrecycling.com Hello, I am looking to fix a few minor things that would require me to change the text size on mobile only. For example, the home page. Only the 3rd line "CLOSING THE LOOP ON THERMOFORMS | NO MATERIAL TOO DIRTY | FDA FOOD GRADE FLAKE, READY FOR EXTRUSION" needs to be smaller for mobile to fit nicely. But if I reduce desktop, it will not be legible. Does anyone have some help for this? Mobile Only- Certain Sections- On Certain Pages- Certain Text Lines Thank you kindly 🙂
  11. Site URL: https://www.jonnehansson.com/ Hi, I have lately realized that the lines are very long to read. Before, I made line breaks by pressing Shift+Enter, and I think that is not the correct way to do, because the line breaks look weird on mobile. Is there a way to adjust the width of each text block or the entire page? I want to reduce the text block width on every "Selected works" sub-page, but, still want to keep the site width at 950 px. Thank you:) Jonne
  12. Site URL: https://www.plantshopmanchester.com/ Hi there! We currently have products sorted by categories, and you can view all the products by category using the drop-down menu. Problem is, I want to add a description for each category page as a text box below the category title. I can't do this currently, as the pages are Link pages which link to the category, and they aren't editable. I tried setting each Category up as a separate Store page, where I can add a block of text, but this means they won't show under the View All page, and I also can't add existing products to each page, I can only make new products for each page, and some products come up under multiple categories, so I don't want duplicates. For example, we have products under the 'Pet Friendly' category, which may also fall under the 'Bright Light' category. Does anyone have a work-around?
  13. Site URL: https://www.thierrybamas.fr/toutes-nos-patisseries Hi, did you know how is possible to center the .product-scarcity an font please ? Thanks
  14. Site URL: https://stonewall-construction-inc.squarespace.com/multi-family Hi, I'm looking for the CSS to move the titles of each project on this page to the top of the images. The page is https://stonewall-construction-inc.squarespace.com/multi-family and the password is "jackson". There will be multiple pages like this so it doesn't need to be specific to just this page.
  15. Site URL: https://www.agencymvp.com/mvp-university-main We want to add a text field below each MVP University section that explains what that section is. For example, when one of our users clicks 'Agent Kickoff' and we filter through only the agent kickoff videos, we also want a text field above all the videos that says "Our Agent Kickoff section is all about how to get your MVP account set up...". The challenge in setting this up is that when we click 'Agent Kickoff' in MVPU, we're actually staying on the same page (same URL) and just filtering out certain categories/tags. That means that any new text field we put on that page doesn't change accordingly with the filtering that takes place when you select a certain category like 'Agent Kickoff. Is there a way to solve for this? I've included a screenshot on where the text would go. Site URL: https://www.agencymvp.com/mvp-university-main
  16. Designing a website with a lot of text-based information can be a challenge as big chunks of text can be off-putting to the reader. Often, we rely on imagery to draw the users' attention or help communicate a message. But what if we don't have or want to rely on imagery? What are some practices you've used or seen that create an engaging and informative display of textual content? Share in the comments below!
  17. Site URL: https://bird-antelope-bfrm.squarespace.com Hi @tuanphan! Hope you doing well ! I need help to align an image and a texte on the bottom on the same line without using the space but with CSS Code. Can you help me ? Here is the link : https://bird-antelope-bfrm.squarespace.com Pass : TheAntidoteInk Thank you so much !!
  18. Hi all, does anyone know how to overlay text on top of GIFS (the GIFS are being used on the main page of my site, and are uploaded via an Album photo block) Thank you!
  19. Site URL: https://www.locallocalfoods.com/ Password: LLF Hello! Anyone know why I am unable to change the color of the caption text in my form boxes? I already tried changing it in my site styles under the form block > caption color > white but it isn't working for some reason. I'm also having trouble finding what to target in the css to get it to change. Any help or CSS code to override would be greatly appreciated. Thanks!
  20. Site URL: https://blackbird-bagpipe-r9gf.squarespace.com/ page url is currently https://blackbird-bagpipe-r9gf.squarespace.com/ Underneath the header, the text that says "it's pronounced rasheed" I have tried and failed in this design endeavour. What I'm trying to do is get that text to be positioned much higher, much closer to the page title. I've looked in the spacing and font settings under 'Site Styles' but I can't find any options that can adjust the spacing in just this single instance. Thank you very much for any advice you can offer me. As a bonus, if it's possible, I'm hoping to style that font differently. The only way I found to do this was to set it as 'paragraph 1' which isn't in use anywhere else on the site, and then change the global font size for 'paragraph 1'. This fix isn't ideal because it changes the whole global setting, and also I wasn't able to increase the letter spacing here, I just did a botch by adding more spaces in between the characters.
  21. Site URL: https://clementine-groundhog-9shj.squarespace.com/ Hi there, I would like for when people click onto an image and a Lightbox opens there to be information also in this Lightbox to accompany the picture similar to how products look when you click onto their image. Password: blox Thanks
  22. Hello! I recently came across the typewriter delete effect, courtesy of @taunphan. What I'm trying to do is changing the colors of the three different elements of the code. So for this example I would like "type" to be white, "writer01" to be of a certain hexcode. And then I would like to also change the color of the data-words according to a hexcode. Main components of what I wish to change: <div class="container"> <h1> typewriter01 | <!-- The words that we want to have typerwriter effect --> <span class="txt-type" data-wait="3000" data-words='["consultancy", "food", "creative tech", "ranj"]'></span> </h1> Entire code: <div class="container"> <h1> typewriter01 | <!-- The words that we want to have typerwriter effect --> <span class="txt-type" data-wait="3000" data-words='["consultancy", "food", "creative tech", "ranj"]'></span> </h1> </div> <style> /* CSS RESET */ /* ALIGN CONTENT */ .container { display: flex; /* Remove horizontal 'justify-content' center if you want the base text not to move */ justify-content: center; align-items: center; } /* ADD CURSOR */ .txt-type > .txt { border-right: 0.08rem solid #fff; padding-right: 2px; /* Animating the cursor */ animation: blink 0.6s infinite; } /* ANIMATION */ @keyframes blink { 0% { border-right: 0.08rem solid rgba(255, 255, 255, 1); } 100% { border-right: 0.08rem solid rgba(255, 255, 255, 0.2); } } #page .section-background {background: white;} #page section * {color: black !important;} #page .content { width: 100%; } </style> <script> class TypeWriter { constructor(txtElement, words, wait = 3000) { this.txtElement = txtElement; this.words = words; this.txt = ""; this.wordIndex = 0; this.wait = parseInt(wait, 10); this.type(); this.isDeleting = false; } type() { // Current index of word const current = this.wordIndex % this.words.length; // Get full text of current word const fullTxt = this.words[current]; // Check if deleting if (this.isDeleting) { // Remove characters this.txt = fullTxt.substring(0, this.txt.length - 1); } else { // Add charaters this.txt = fullTxt.substring(0, this.txt.length + 1); } // Insert txt into element this.txtElement.innerHTML = `<span class="txt">${this.txt}</span>`; // Initial Type Speed let typeSpeed = 50; if (this.isDeleting) { // Increase speed by half when deleting typeSpeed /= 2; } // If word is complete if (!this.isDeleting && this.txt === fullTxt) { // Make pause at end typeSpeed = this.wait; // Set delete to true this.isDeleting = true; } else if (this.isDeleting && this.txt === "") { this.isDeleting = false; // Move to next word this.wordIndex++; // Pause before start typing typeSpeed = 500; } setTimeout(() => this.type(), typeSpeed); } } // Init On DOM Load document.addEventListener("DOMContentLoaded", init); // Init App function init() { const txtElement = document.querySelector(".txt-type"); const words = JSON.parse(txtElement.getAttribute("data-words")); const wait = txtElement.getAttribute("data-wait"); // Init TypeWriter new TypeWriter(txtElement, words, wait); } </script> Any ideas? Source: https://forum.squarespace.com/topic/159551-typewriter-delete-effect-typeit-or-something-similar/#comment-387144
  23. Site URL: http://lylasapir.com Hi, Does anyone know if it's possible to add a png icon at the end of a text line? As shown in the image below?
  24. Site URL: https://bulldog-oriole-mnxr.squarespace.com Hi! @IXStudio Im fairly new to Squarespace and was trying to create a typewriter effect to a text on my site but wasnt quite able to get it running. Tho Im not quite sure why it doesnt work, I wondered if it needs a higher tier subscribtion? I currently have the cheapest one. I have tried every way I can think of, and now Im stuck. Site password: coco Thanks!
  25. Site URL: http://www.dustin.land/photo There isn't an option to place project labels above the image - it's just below the image and that's it. Have a look on my page: https://www.dustin.land/photo Perhaps someone might know of some CSS that could assist me with this! Many thanks for your help! Dustin
×
×
  • Create New...