Right clic customization not working

Tic Tac · September 5, 2013

Hi...

I've followed the instructions found here:
http://www.smugocity.com/CSS/Text-Replace/Custom-Right-Click-Protection

However, no change. Can not understand why. The code was put in my CSS for all galleries.

Any ideas?

dallasw · September 5, 2013

I just tried using those instructions and it worked for me. Would you mind linking to one of your galleries and I can take a look?

Tic Tac · September 5, 2013

Sure! There you go...

http://www.yaphoto.ca/Gallerie/Insectes

dallasw · September 5, 2013

There was a bug in the CSS and how it interacted with the SmugMug Dark theme. Specifically, the 'sm-user-ui' class didn't exist on the body.

Try this:

.sm-right-click-message:after {
  content: 'Custom Right Click Message';
}

.sm-right-click-message .sm-tooltip-content {
  display: none;
}

I also updated the code on the smugocity site in case anyone else runs into this issue.

Tic Tac · September 5, 2013

Works very well!!!!

Thank you!

Question: Is it possible to include a carriage return in the string that is placed there?

dallasw · September 5, 2013

Tic Tac wrote: »

Is it possible to include a carriage return in the string that is placed there?

Carriage returns can be inserted by setting the 'whitespace' to 'pre' and inserting ' \000A ' where the carriage return should be. For example:

.sm-right-click-message:after {
  content: 'Custom Right \000A Click Message';
  white-space: pre;
}

.sm-right-click-message .sm-tooltip-content {
  display: none;
}

W.W. Webster · September 6, 2013

I don't understand why my custom right-click message is displayed with only a partial grey background, as follows:

This is the CSS code I'm using:

.sm-right-click-message:after {
  content: 'All images on this site are the exclusive property of Ross Collins and subject to \000A protection under international copyright and other intellectual property law. \000A \000A All unauthorised use is prohibited. \000A \000A For further information, click the Copyright link in the menu bar.';
  white-space: pre;
}
.sm-right-click-message .sm-tooltip-content {
  display: none;
}

Can anyone explain where I've gone wrong?

charlesdaly · September 6, 2013

W.W. Webster wrote: »
I don't understand why my custom right-click message is displayed with only a partial grey background, as follows:

This is the CSS code I'm using:
.sm-right-click-message:after {
  content: 'All images on this site are the exclusive property of Ross Collins and subject to \000A protection under international copyright and other intellectual property law. \000A \000A All unauthorised use is prohibited. \000A \000A For further information, click the Copyright link in the menu bar.';
  white-space: pre;
}
.sm-right-click-message .sm-tooltip-content {
  display: none;
}
Can anyone explain where I've gone wrong?

Here is what I came up with, I hope it works for you. I know there's a code somewhere in these pages on how to format the right click box -brground color and size, etc. I tried this on my site and it works for me: (all I did was move the line breaks)

.sm-right-click-message:after {
content: 'Did you know that you can buy \000A my images and download them? \000A That way we would both be thrilled. \000A Now that is thrilling?';
white-space: pre;
}
.sm-right-click-message .sm-tooltip-content {
display: none;
}

dallasw · September 6, 2013

W.W. Webster wrote: »

Can anyone explain where I've gone wrong?

You haven't done anything wrong, just need some slight tweaks.

The 'white-space: pre' style means the text will only break to the next line where you put the '\000A '. To make yours fit in the box, you can either add more line breaks so it doesn't go outside the box (which I'd recommend), or you can add: '.sm-tooltip.sm-right-click-message { max-width: none; }' to your CSS.

Sir_Eagle · September 6, 2013

W.W. Webster wrote: »
I don't understand why my custom right-click message is displayed with only a partial grey background, as follows:

This is the CSS code I'm using:
.sm-right-click-message:after {
  content: 'All images on this site are the exclusive property of Ross Collins and subject to \000A protection under international copyright and other intellectual property law. \000A \000A All unauthorised use is prohibited. \000A \000A For further information, click the Copyright link in the menu bar.';
  white-space: pre;
}
.sm-right-click-message .sm-tooltip-content {
  display: none;
}
Can anyone explain where I've gone wrong?

I added this:

/*MAKES BOX COVER ALL TEXT*/
  .sm-tooltip-floating {
    max-width: none;
    text-align: center;
  }

W.W. Webster · September 6, 2013

Thanks!

dallasw · September 6, 2013

Sir_Eagle wrote: »

I added this:

/*MAKES BOX COVER ALL TEXT*/
  .sm-tooltip-floating {
    max-width: none;
    text-align: center;
  }

Note that this will apply to all SmugMug tooltips, not just the right click message. To affect only the right click message, the more specific '.sm-right-click-message' selector can be used.

Sir_Eagle · September 6, 2013

dallasw wrote: »

Note that this will apply to all SmugMug tooltips, not just the right click message. To affect only the right click message, the more specific '.sm-right-click-message' selector can be used.

Thanks for the tip

Right clic customization not working

Comments