Etikett : wordpress

Gmail och kontaktformulär i WordPress

För ett tag sedan så satt jag och arbetade med en egenhostad WordPress-blogg. Allt fungerade bra, och vi sjösatte det hela utan några problem. Vi har en checklista med punkter som gås igenom när vi levererar en sajt. Allt för att säkerställa att det fungerar bra. En av punkterna är att kontrollera att kontaktformulär (om det finns ett sådant) fungerar som väntat. I detta fall så fungerade allt som väntat.

Det jag däremot inte kollade upp var att mejlet från kontaktformuläret hade kommit fram. Innan och efter leverans så testar vi genom att ange ett testkonto som mottagare för kontaktformuläret. Mejlet kom fram, och det var inga konstigheter med det.

Efter två veckor så kontaktade kunden oss och var lite konfunderad. Han beskrev att folk hade använt kontaktformuläret vid ett flertal gånger, men det hade inte kommit fram något till honom. Jag gick in och kollade vad som kunde vara fel. Det var inte webbhotellet (Binero) som krånglade och inte heller kontaktformuläret (Gravity Forms).

Googlade lite och hittade mest referenser där folk hade problem med en närmast antik version av WordPress (själv har jag arbetat med WordPress sedan det hette b2 cafelog). Till slut efter ha slitit mig i håret så hittade jag en forumtråd där någon hade samma problem. I den tråden framgick det efter ett par sidor att problemet handlade om att mottagarmejlen var en Gmail-adress. Eftersom man måste logga in på Googles SMTP server för att kunna skicka mejl så var det inte undra på att det inte gick.

Configure SMTP tillägget för att ställa in att Gmail går att använda i kontaktformulär etc i WordPress Vår kund hade också flyttat över sin mejl till Google Apps (vilket vi också använder) dagen efter vi hade installerat allt. Lösningen på problemet var enkelt. Jag installerade WordPress-tillägget ”Configure SMTP” som i princip sköter allt själv. Det man behöver göra är att autentisera sig mot Gmail med sin epostadress och lösenord (se skärmdump). Man kan skicka iväg ett testmejl för att se att det fungerar.

Läxa lärd, och konstigt nog så hade jag aldrig råkat på detta innan. Givetvis lite pinsamt för oss. Nu så har fler och fler lagt över sin mejlhantering på Google Apps och Gmail, så nu är ”Configure SMTP” något som vi i de flesta fall installerar som standard.


Extern länk: Configure SMTP (WordPress)

CSS Etikettmoln till WordPress

För cirka ett år sedan så arbetade jag med en WordPress baserad blogg åt en kund. Fastnade lite på etikettmolnets utseende i sidmenyn. Satt och experimenterade lite förstrött tills jag fick fram något som såg lite småkul ut. För demo, kolla in filmen nedan.

Standard CSS för WordPress. Du kanske måste byta namn på klasserna för att få det att passa ihop med ditt tema. Fungerar givetvis att implementera till vad som helst.

.widget_tag_cloud {
	padding: 10px;
	overflow: hidden;
	background-color: transparent;
	clear: both;
	font-size: 1em;
}

.widget_tag_cloud a:link {
	font-size: 1em!important;
	border-radius: 8px 8px 8px 8px;
	-moz-border-radius: 8px 8px 8px 8px;
	-webkit-border-radius: 8px 8px 8px 8px;
	background: #fcfeff none repeat scroll 0 0;
	display: block;
	font-weight: bold;
	height: 14px;
	line-height: 14px;
	margin: 3px;
	padding: 3px 5px 3px 5px;
	text-decoration: none;
	float: left;
	text-transform: uppercase;
	color: black;
	box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
	transition: color .25s linear;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	opacity: 1;
}

.widget_tag_cloud a:hover {
	border-radius: 8px 8px 8px 8px;
	-moz-border-radius: 8px 8px 8px 8px;
	-webkit-border-radius: 8px 8px 8px 8px;
	background: #435c43 none repeat scroll 0 0;
	display: block;
	font-weight: bold;
	height: 14px;
	line-height: 14px;
	margin: 3px;
	padding: 3px 5px 3px 5px;
	text-decoration: none;
	float: left;
	text-transform: uppercase;
	color: white;
	opacity: 1;
	-webkit-transform: rotate(720deg) scale(2,2);
	-moz-transform: rotate(720deg) scale(2,2);
	-o-transform: rotate(720deg) scale(2,2);
	transform: rotate(720deg) scale(2,2);
	box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 1px 0 rgba(0,0,0,.1);
}
QR Code Business Card