sihole

Any news on this issue?

Yes, I did it with custom code! Here it is: .eventlist-excerpt a { background-color: #194027 !important; color: white !important; font-family: times !important; font-size: 16pt; font: cambria; padding: 10px 14px; text-decoration: none; } .eventlist-excerpt:hover * { opacity: 0.85 }

Thank you for your reply! Setting opacity to 1 removes the hover opacity effect completely, and I do want it on the text/button, but not for the whole width of the summary block and event list... Can this be accomplished? It can also be another kind of hover effect, like shadow or something else. (see attached pic for a demonstration on how it works now in event list. The same happens in summary block. You can see the hover opacity effect is activated when the mouse pointer is on the same line as the excerpt) Best, Sigurd

Hi! I have made a change to the excerpt in summary and eventlist, giving the letters a background to resemble a button. I now want to create some kind of hover effect, which I did (opacity), but it initiates the hover effect for the full with of the summary block or event list (moving the mouse button to the opposite side of summary block initiates hover). I just want it to initiate when the mouse is over the button ( BILLETTER ). How to accomplish this? www.morgenkonsert.no

Hi! Site url is www.sigurdhole.no I just installed a hamburger-menu plugin by Ghost, it seems to work well - but I would like to be able to change position of the site title, either center or to the right. How may this be achieved? (changing the layout in the "edit header" built in editor does not work, the logo in center layout makes site title appear too far left of center, and the logo right layout interferes with my audio playback icon) Sigurd

Mobile looks OK now, after tweaking menu-icon-spacin in the plugin CSS. But still, the site title is off center in desktop, the same is the hamburger menu that shows up aftler clicking the hamburger icon. Ideally, I would like to be able to change the spacing of the menu icon separately on mobile and desktop, as well as getting both the site title and the hamburger menu centered. Help is much appreciated!

Hi. I just installed the ghost plugin to make my desktop menu hamburger-style. But the plugin sort of made both the mobile and desktop header ugly, title is off center and on mobile also the palcement of other header objects is off. How to correct this? Site: www.sigurdhole.no Thanks! Sigurd

Hi! Picking up in this thread. Been using my site without the hamburger meny, but now I want to change it. Where should I add this code? Best, Sigurd

Hi, I found the code below to make the menu of the desktop-version of my site also into a hamburger-menu. But when I apply the code, the audio icon to the right in my header disappears, and my site title moves slightly right. How to workaround this issue? (the below hamburger code not currently applied as my site is live and I do not want it to look messy, but I still hope you might be able to help out in correcting the issue) .header .header-burger{display:flex} .header-nav, .header-actions {display:none} .header--menu-open .header-menu { opacity: 1; visibility: visible;}

Yes, I found a way to keep the cart in the header in a way that works for me (I found to only show the cart if an item is placed inside it for purchase in the header, this works nicely).

PS: site - https://dahlia-chameleon-xdem.squarespace.com/ pass - sketchingsound

Hi! I am considering adding a landing page to my site. I have designed the page, and set it as the site homepage. I want this to be the first thing visitors see. They then need to click the "enter site button" to enter the site/homepage. This works, but I then need to change the site title URL to not lead back to landing page, but rahter to the home page. How may this be achieved..? Best, Sigurd

... I found some code to fix this, now my cart only shows when something is added. Thank you for you help!

Yes, this works - thanks a lot!! 🙂 I also have one more question. I would ideally like for the cart icon to appear only when someone adds an item to it for purchase. Is this possible?

Hmm, strange - this is what it looks like at my end:

Hi! Is there a way to change the position of the shopping cart on my site? I want it to appear to the left of the audio playback icon in the header. https://dahlia-chameleon-xdem.squarespace.com/ pass: sketchingsound

PS: and, when it shows, it would be nice if it shows next to the audio icon, not on top of it. Any help is greatly appreciated, soon about to make the site live and I would really like for this issue to be resolved and working nicely before going live. Sigurd

Change of plans: I would like to have the cart in the header instead - but displayed only when something is added to the cart from the store. Is this possible? (I already have a somewhat complicated header with an audio playback icon that needs the cart to be enabled to show. Tried some new code to show cart when something is added, but now it shows all the time...) Best, Sigurd

Hi! I have intentionally hid the cart from my header, and it also gone from the footer. Here is what I want: I do want the cart to appear in the footer, but only after an item is added. Cart should never appear in header. Any ideas on how to achieve this? site: www.sigurdhole.no pass: sketchingsound Hope someone might be able to help out! Sigurd

Thanks a lot! This worked 🙂 Is it possible to change the size of the icons? I would like them to be a bit larger if possible.

Ah, sorry. I was trying to fix it myself and therefore had messed up the code. Now I have inserted the original code I got from the forum (in advanced/code injection/footer) and the play/pause buttons are back. I have learned that I need a newer version of Font awesome to make my desired icons work. I have registered as a Font awesome user, and on my account it says version 6. Below are my kit codes, cc from my account. <script src="https://kit.fontawesome.com/a0d43cfa57.js" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://kit.fontawesome.com/a0d43cfa57.css" crossorigin="anonymous"> How to put it all together to get the icons I want? Thanks!

Now I registered and got my own kit kode for free icons version 6 (see below, copy/paste from my kit at the font awesome website). I tried switching the old kit codes with the new ones in your last suggestion, but still no icon. Perhaps we to change other aspects of the code as well? <script src="https://kit.fontawesome.com/a0d43cfa57.js" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://kit.fontawesome.com/a0d43cfa57.css" crossorigin="anonymous">

Hi! I have succsessfully managed - with wonderful help from the Forum (thanks!) - to add audio to the top right corner of my header. But I would like to change the play/pause buttons I now have, to more audio spesific icons like theese: https://fontawesome.com/icons/volume-off?s=solid&f=classic https://fontawesome.com/icons/volume-high?s=solid&f=classic How can this be achieved? Site: https://dahlia-chameleon-xdem.squarespace.com Pass: sketchingsound

When I try this code there is no icon at all... what should I do?

This did not seem to work.. the code I used initially, after applying your custom css code for removing the cart, actually worked quite well. I just want to change the icons. Should we not then just tweak this intial code to show the icons I want? <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"/> <script> $(document).ready(function() { // audio icon $('<a id="play-pause-button" class="fa fa-play"></a>').appendTo('.header-actions--right .header-actions-action'); }); </script> <script> $(document).ready(() => { var audio = new Audio("/s/3-Lys_fra-Lys-Mrke.mp3"); audio.onended = function() { const list = document.querySelectorAll('#play-pause-button'); for (let i=0; i<list.length; i++) { $(list[i]).removeClass('fa-pause'); $(list[i]).addClass('fa-play'); } }; window.addEventListener('mousedown', (e) => { const btn = e.target if (btn.id === 'play-pause-button') { console.log(3534); if($(btn).hasClass('fa-play')) { $(btn).removeClass('fa-play'); $(btn).addClass('fa-pause'); audio.play(); } else { $(btn).removeClass('fa-pause'); $(btn).addClass('fa-play'); audio.pause(); } } }); }); </script>