Email with social buttons?

divamum · March 31, 2015

Is there a way to include a mailto (with icon) within the social buttons block? It would be great to have it all lined up in the same place on the page with Fb Twitter etc using an envelope icon that matches the others (as seen on so many other sites.) but I see no way to do that, or even include any contaact link other than on the nav bar.....

Thanks in advance!

denisegoldberg · March 31, 2015

I believe you would need to use a menu content element to use the contact form. You could drag the content element next to the social icons.

I don't see a way to use an icon in the menu content block but I suspect CSS could be used to change the menu entry.

--- Denise

annnna8888 · March 31, 2015

Denise already provided an idea, and here's another option: you can use an HTML content block positioned next to the social icons. You will need to find an image/icon to use and make it clickable so the contact form opens.

Add this code to the HTML content block:

<div class="sm-footer-navitem-contact">
<a href="#">
<img src="http://www.linktotheimage.jpg" alt="image" />
</a>
</div>

Note that the contact form will only appear when logged out.

Ana
SmugMug Support Hero

denisegoldberg · March 31, 2015

annnna8888 wrote: »

Denise already provided an idea, and here's another option: you can use an HTML content block positioned next to the social icons. You will need to find an image/icon to use and make it clickable so the contact form opens.

That's a much better solution!

I didn't realize that the contact form could be accessed like this, good to know.

--- Denise

divamum · March 31, 2015

Thanks! This may be beyond my skill level, but I'll see if I can figure out what you both just said lol

ETA: I just played with the social block again, and realise there's a place for "custom" - that will display in a matching size/style icon, but of a chain (ie link). How could I customize that icon? There's nowhere in the block to choose anything other than an url. I could easily make a 'contact" page, and link it to that, I just want it to match the style next to the twitter/FB standard icons

In the meantime, could this be a request to Smug? It seems it would be so easy to include it as another option in the social media block, to be used (or not) as the individual wanted!

annnna8888 · March 31, 2015

To the best of my knowledge, it's not possible to customize the custom link in the social icons content block, so you'll be better off going with either of the two suggestions provided in this thread.

Ana
SmugMug Support Hero

Tom Foster · April 1, 2015

annnna8888 wrote: »

Note that the contact form will only appear when logged out.

I wasted hours wondering why my contact button wasn't working and messing with CSS before I realised this!

jerryr · April 1, 2015

Hi
I have used this advance css to customize the 'custom' (link button). I used 'branded' and 'medium' for the settings and created an image 40px in width by 40px in height. As indicated by the below, I changed the URLOFIMAGE to the actual URL.

/* Social Media */
.sm-page-widget-social-links-link .sm-official .sm-fonticon
{
background-image: url("URLOFIMAGE");
height: 40px;
width: 40px;
background-repeat: no-repeat;
background-position: top center;
color: transparent;
}

.sm-fonticon-LinkSquare:before {
display: none;
}

sm-fonticon-Link:before {
display: none;
}

.sm-user-ui .sm-page-widget-social-links-link .sm-official .sm-fonticon:before {
display: none;
}

examples :
http://www.meggenwatt.com/
http://www.marcellorostagni.com/
http://www.jakigoodmiller.com/Seniors/Home (all social media buttons customized)

divamum · April 2, 2015

Thanks!! Leftquark also replied with code here http://www.dgrin.com/showthread.php?p=1993327 so there are a few options now. Hope this helps somebody else trying to do the same thing!!

Email with social buttons?

Comments