Jump to content

JOHNMD

Circle Member
  • Posts

    89
  • Joined

  • Last visited

Everything posted by JOHNMD

  1. @MartyMeh To style on version 7.1. Link Alignment: .header-menu-nav {text-align: left!important; margin-left: 15%!important;} Page Background color: .header-menu-bg {background: red!important;} Add image as background to Page: (replace with your image.) .header-menu-bg {background-image: url('https://static1.squarespace.com/static/5e04314e1e03733084a0d51a/t/5ece9831d9f131439a22411a/1590598888064/Cork-City-Centre-at-Night.png'); background-repeat: no-repeat; background-size: cover;} Space between links: .header-menu-nav-item {line-height: 20px!important;} Link text : .header-menu-nav-item > a {color: green!important;} Floating header is set in the Header Edit option. Select Style > and toggle to Fixed. - John
  2. @rachelt Hey, typically, if you set the first line below, then all your paragraphs (p) should hold over to the Mobile settings, that is unless you have created css for specific targeted divs. You should only require one line of code - the first line below. The second line of code below is a Media Query specific to Mobile. You'll note that I set that line to"text-align: right" to see where this leads you. If you input both lines (three total below) then you should see a difference and know the code is effective. You can reset to using the first line. p { text-align: justify; } @media only screen and (max-width: 640px) { p { text-align: right!important;} } - John
  3. @racheltI'm unclear how you input your titles above. You appear to have different font sizes; some maybe h2 h3 and so on, or you may be using image-captions. Usually the best approach is to locate your Page Section ID and you can replace the "number" in the following code line: [data-section-id="5ea91572b3afb8186001cf71"] .image-caption{ text-align: left!important;} or: [data-section-id="5ea91572b3afb8186001cf71"] p { text-align: left!important;} or: [data-section-id="5ea91572b3afb8186001cf71"] h2, h3 { text-align: left!important;} - hope this helps On earlier revert to: @media only screen and (max-width: 640px) { p { text-align: justify!important;} } or, @media only screen and (max-width: 640px) { p { text-align:left!important;} } There are several options for Justify text. I find for short sentences align-left looks best. https://www.w3schools.com/cssref/css3_pr_text-justify.asp
  4. @rachelt Try this in Design> CSS @media only screen and (max-width: 640px) { p { text-align: justify!important; text-justify: inter-word!important;} } - John For your image question: usually what I do is open up the image editor for each image, select the crop tool and set all photos to the same aspect ratio eg 1:1 for square.
  5. @rachelt In your Design> CSS add p { text-align: justify; text-justify: inter-word; } - John
  6. @CpeoplesIIIThe answer is: You cannot crop within a video image as the video was originally encoded at full-frame and requires a software decoder embedded within the video for playback. The embed code within SQS works fine for youtube videos. If you own a video that you want to crop, you have to import your full-fame video into video editing software, crop the video, re-size the video (zoom in on itself, going to look pixalated or have black borders, or be a non-standardized video file size) with an effect. When you have rendered your new video you then re-compress the video for export and then import to your platform of choice (must be a standard video size). There is a possible CSS solution; if you place the video as a background and use a foreground overlay as a frame, however as the video playback controller is embedded with the video your going to require some serious coding capability and expect your site to be black listed by Google very quickly.
  7. @Adam_Davidson@Wisemedia@tuanphanOn 7.1. first code line to fix header position. Second line to make drop down background transparent from folder. Set you header to transparent background in header pencil settings. .header#header {position: fixed!important;} .header-nav-folder-content { background: transparent!important; } - John
  8. @tylernkime You have all the details. The font foundry company has been very responsive. The Bruno font works with the correct version. I think it's only fair to adhere to their License Agreement. - John
  9. @tylernkimeHave it working with thanks to MADE: Use the otf font which is located in their folder marked 'desktop'. You may need to ask the company madetypeinfo@gmail.com for an updated font file, as you'll notice that my otf version references woff2 in the below sting which appears different to your original file. My code lines are below with Youtube video you can follow. The code is: @font-face { font-family: 'bruno'; src: url('https://static1.squarespace.com/static/5e04314e1e03733084a0d51a/t/5eba88d1b4728154f2f0a428/1589283026214/Bruno.otfbruno-webfont.woff2'); } h3 {font-family: 'bruno'; font-style: italic; font-size: 50px;} .portfolio-text > h3 { color: blue!important; font-size: 30px!important;} https://www.youtube.com/watch?v=4WsiwqQluZc again, to apply the font to all your site h3s you do not need to use last code line above. The last line of code targets your h3 header in the portfolio page only. - John
  10. @tylernkimeI went ahead and purchased the font and yes, there are issues with it. It keeps reverting to a web-safe option. The foundry nicely provided me a couple of updates to try out with no success thus far; things are currently back in their hands. I have to say it's a nice font and I discovered the same foundry has one other font of interest to me. Hopefully. we get it working.
  11. @tylernkime for 7.1 should be: portfolio-text > h3 {font-family: your font here !important; font-size: 30px!important;} - John
  12. You can integrate Freshbooks, or a combination of Wufoo and Freshbooks. There's a higher cost involved, you are essentially taking your invoice and cart functions to other, more focused platforms with your main content remaining on SQS.
  13. One option is to replace your line block with a Code Block on the page and the use the following code (you can adjust the line length (width) in % , for example to 50%, and change the thickness and line color in the code): <style> hr.line { border-top: 1px solid light-gray; width: 75%; } </style> <body> <hr class="line"> </body>
  14. Is SEO dead with the continued move to mobile and establishment of Amazon as a primary search engine and Facebook etc. as primary platforms on the web ? What types of searches; informational, comparison, transactional, and so on, should we be optimizing our site for - what part of the searchers journey should we target to optimize our investment in SEO ? Can you share your definition of SEO and your model for its Return on Investment and compare this to an investment in paid search? Perhaps, you can touch on site design for SEO and Paid Search - how should we consider landing pages? Do you conduct a Site SEO Audit for clients, how do you approach new clients, what information do you look at in Squarespace and what tools do you recommend? - Sorry, several questions there. Thank you! - John
  15. If you have Facebook Account Admin Access Facebook should allow you to generate the required Event Page code (see link below). Back In Squarespace, add an 'Embed' Block to a page. In the 'Embed' Editor hit the '<>'on the right-hand side. Copy and Paste the code from FB to the 'Embed' editor. Click set. You may get a message saying something like 'live stream not available in Edit mode', so hit save. And I'd expect the Facebook feed to be on your page. If I'm overlooking something let me know. It's a good idea. https://developers.facebook.com/docs/plugins/page-plugin/
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.