mgwebsite Posted December 31, 2020 Share Posted December 31, 2020 Site URL: https://metgal.art/ In order to get our portfolio (RESULTS page) hover over titles to appear as we want, I included some html. I thought by editng the SEO descriptions they wouldn't show up when searched in Google, but they do in some areas (like the general portfolio page). Can anyone help include CSS to help format the titles how we have them so I don't have to worry how they display in Google? Images to help illustrate below. Link to comment
tuanphan Posted January 1, 2021 Share Posted January 1, 2021 Hi. If you use Business Plan, we can replace <br><p> with some other characters, example: #, |,.. It will still show up on GG (#, | or...), but it will look better than html tag. Do you use Personal or Business Plan? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
tazmeah Posted January 2, 2021 Share Posted January 2, 2021 What if you wrote the titles in plain text (without the HTML) for SEO purposes, then had a script on the RESULTS page convert it to the way you currently have it? I'm not sure if that's the best idea, but it's another idea. For example, your title would be "GENSLER - AUSTIN, TX" (notice it's hyphen separated), then script added to the RESULTS code injection would say to split it in half at the hyphen and add your other code when the page is loaded. window.addEventListener('DOMContentLoaded', (event) => { document.querySelectorAll("h3").forEach(function (el, ind) { // this line below says to split it at the hyphen... var [place, location] = el.innerHTML.split("-"); el.innerHTML = el.innerHTML.replace(location, "<p style='font-size:20px; line-height:0.1; transition-timing-function:ease; transition-duration: 1.5s; transition-delay: 0.391837s;' class='preFade fadeIn'>" + location + "</p>"); el.innerHTML = el.innerHTML.replace(" -", "<br>"); }); }); Or, let's say you'd prefer your titles to use two forward-slashes for SEO, like "GENSLER // AUSTIN, TX". I'll write that code too so you can compare the changes on lines 4 and 6. window.addEventListener('DOMContentLoaded', (event) => { document.querySelectorAll("h3").forEach(function (el, ind) { // this line below says to split it at the two forward-slashes... var [place, location] = el.innerHTML.split("//"); el.innerHTML = el.innerHTML.replace(location, "<p style='font-size:20px; line-height:0.1; transition-timing-function:ease; transition-duration: 1.5s; transition-delay: 0.391837s;' class='preFade fadeIn'>" + location + "</p>"); el.innerHTML = el.innerHTML.replace(" //", "<br>"); }); }); Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.