One of the weaker points about the Weebly editor is that social buttons have to be manually configured for every single page of the site. Customisation options are also limited.
I decided to use "Add This" share buttons and have added both the side buttons, as well as the floating mobile share and follow buttons. 14 OCTOBER UPDATE Decided to switch from Add This to Sumo Me and think it was definitely the right decision - Sumo Me offers so many more applications with their free version (heat maps, google analytics simplified, customised share buttons, scroll bar, welcome map). Also installed the Hello bar that should pop up before users leave the site. The interesting thing is that it allow s for A/B testing even with the free version so let's see how that goes. While I hate pop-ups, especially those that pop-up right as you click on the site, I actually think a pop-up before a user leaves, with a final plea for a donation may work. Over to you, what do you think?
Comments
Earlier this year, I went on a mission to test out all the drag and drop website builders (e.g, Wix, Weebly, Strikingly, Squarespace, Webflow, Wordpress and Tumblr). That's how the debbiediscovers name came about, in order to create free versions of each site, you had to use your username as a subdodmain and I thought it would be cute if it sounded like I had discovered the website builder, hence:
www.debbiediscovers.weebly.com www.debbiediscovers.wix.com www.debbiediscovers.strikingly.com www.debbiediscovers.tumblr.com www.debbiediscovers.webflow.com www.debbiediscovers.wordpress.com Check out my portfolio here. Initially I did not like the Weebly editor at all, but when I heard about the new ugprade, I decided to try it out and make this site. The new upgrad includes:
The suite of third-party apps is very impressive - I've incorporated some of them on this site to test them out (e.g. the Forum, the HTML based comments form). This can be a good thing or a bad thing - part of why Strikingly and Squarespace sites lookso good is because they don't allow some of these third party apps on their site, protecting the aesthetics of the site. And very importantly, it allows you to edit the underlying HTML, CSS Javascript, export the site (it has a great back-up feature that lets you download a zip file of the site which no other site lets you to do), and the Weebly branding at the bottom of the site is not as much of an eyesore as the Wix or the Strikingly one. The editor has some bugs (elements get misaligned when you publish), social share buttons have to be individually added and configured on every single page ( this is really quite silly - please fix it); you have to manually add in open graph and Twitter card data (unlike Tumblr sites) and not all elements can be edited (e.g. I can't change the colour of the button - Squarespace's style editor is much better). But this might just become my favourite WYSIWYG website builder! Took me 1 day to build this and another day to tweak. Over to you! What do you think? The first thing I noticed was that the new Weebly editor does not add proper open graph data. So when shared on Facebook, the image shown was a segment of my debbiediscovers logo So in order to improve shareability of this site: I had to add open graph meta tags into the header portion of each page: <!-- Update your html tag to include the itemscope and itemtype attributes. --> <html itemscope itemtype="http://schema.org/Webpage"> <!-- Schema.org markup for Google+ --> <meta itemprop="name" content="DebbieDiscovers Needs Your Help"> <meta itemprop="description" content="Let's build a school together with Pencils of Promise"> <meta itemprop="image" content="http://i.imgur.com/CCwSAX5.jpg"> <!-- Twitter Card data --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@debbiediscovers"> <meta name="twitter:title" content="DebbieDiscovers Needs Your Help"> <meta name="twitter:description" content="Let's build a school together with Pencils of Promise"> <meta name="twitter:creator" content="@debbiediscovers"> <!-- Twitter summary card with large image must be at least 280x150px --> <meta name="twitter:image:src" content="http://i.imgur.com/nz9InSi.jpg"> <!-- Open Graph Data for Facebook --> <meta property="og:url" content="http://www.debbiediscovers.weebly.com" /> <meta property="og:type" content="website" /> <meta property="og:title" content="DebbieDiscovers Needs Your Help" /> <meta property="og:description" content="Let's build a school together with Pencils of Promise: This is a dedicated fundraising site for friends and family to learn more about Debbie's campaign to build a school together in Laos with Pencils of Promise." /> <meta property="og:image" content="http://i.imgur.com/CCwSAX5.jpg" /> Note: Add this to each individual page under Pages, SEO Settings and Header Code (and not the overall Settings page). How to Add Open Graph Meta Tags to your Weebly Site1. At the top of the Weebly editor, click on Pages. 2. Go to the Page that you want to add the meta-tags to. Click on the three dots on the extreme left of the page. 3. Once you're on the page, look for SEO Settings. 4. When you're on SEO Settings, scroll all the way down to the bottom until you see Headers. 5. Add to the Header Code by modifying the meta-tags I listed above. If you're using Twitter, change the relevant information to link to your Twitter account, and your Twitter website card. You can check that Twitter is reading your meta-tags correctly by using this validator: https://cards-dev.twitter.com/validator. If you're using Facebook, you'll want to modify the open graph meta-tags. You can check what Facebook is grabbing from your site by using their debugger tool: https://developers.facebook.com/tools/debug/ Note: I used Imgur to generate a shareable link to my open graph images. The ideal size for a Facebook open graph image is 1200 by 630 pixels. The ideal size for a Twitter website card is 800by 418 pixels. Hope that helps! Let me know in the comments if it did, or if you have any questions! |
Categories
All
DEBORAH KAYThis is a simple blog to track my fundraising activities and to keep family, friends and supporters updated on my progress. Archives |