Tag Archives | plugins

FancyBox Plugin for WordPress

Fancybox is an easy to use plug-in that gracefully enlarges images in your posts and pages when a reader clicks on them.

When you upload an image to your blog using the “Media>>Add New” tab in the dashboard, WordPress automatically saves that image in up to four different sizes: thumbnail, medium, large, and full-size, depending upon the image’s original size. (When you “Insert into Post,” you can see which sizes are available.)

If you activate Fancybox, and a reader clicks on the image, a popup will display the image in its largest available size.

The plug-in will automatically convert all images in your blog that don’t have pre-existing links. If you don’t want the Fancybox effect on some images (perhaps you are displaying them in their largest size already), you can delete the link, and the popup will not appear. (This can be done best in the HTML view).

The plugin has a page with many customizable settings to change the borders, zoom rates, overlay color and opacity, but the default settings work fine for starters.

One warning: Fancybox does not work well with posts that use WIKI Inc plugin to “include” wiki page content. If the wiki page that you include has images in it, the Fancybox effect will not work.

Here is a post with a thumbnail image:

And when you click on the thumbnail, Fancybox does its magic:

Have fun with this useful and easy to use plugin!

 

 

“Sociable” and “Share This” WordPress Plugins

Social Media icons make it easy for readers to share the content they find on your blog.  One click and your readers can share your posts and pages to a wider audience.  (Users will be asked to sign into their social media accounts, if not already signed in.)

The Commons has two WordPress plugins that manage social media icons on your posts, Sociable and Share This.  Sociable has a full-featured options panel that allows full icon configuration, including sizes, styles, and placement.   Here is a video introduction to Sociable.


Not to be outdone, Share This has some very detailed instructions that can be found here.  One nice feature of Share This is that it allows for “Multi-Post” sharing within your blog, so that users remain on your site while they share to multiple sites:

So which to choose?  Check them both out and see which one you prefer.

Meta Slider Plugin

meta sliderMeta Slider plugin is simple to use and lets you choose between four different “types” of sliders – Flex, Nivo, Coin, and Responsive.  Each type is responsive, and gracefully changes sizes for different types of devices, and offers various features for layering and transitions.  You can easily swap between the four types to find the one that suits you.

If your theme does not include functionality for a slider, you have some other choices:

  • Rotating Post Gallery – this is the plugin the Commons uses on its Home page.  It has many great features, but it has several drawbacks: it is not responsive, and it is a widget-only plugin – you need a widgetized area to display it.  It also only allows one slideshow per site.
  • Revolution Slider – This plugin is great on a single site, but it is written in such a way that its powerful layering functionality doesn’t work on the Commons.  You can create great slides, but you can’t layer them with captions.  It allows multiple slideshows per site, using convenient shortcodes, and offers many different types of sliders and effects.
  • EasyRotator for WordPress – this is also a great plugin, but it requires that maintain your slides using an external Adobe Air application, which you need to install on your computer. It also allows multiple slideshows per site, using convenient shortcodes.

The Meta Slider addresses the shortcomings highlighted above.  It allows multiple slideshows per site, using convenient shortcodes.  It doesn’t require any external application, and you can layer your slides with rich text formatted with HTML.  It’s simple to quickly set up an attractive slideshow on any page or post, or on a text widget in one of your sidebars.

meta slider tabGetting Started

  • First, decide on the dimensions of your slider for non-mobile devices.
  • Add the images to your media library that correspond to these dimensions. Meta Slider does a good job scaling up and down – but to avoid distortions and loss of sharpness, it’s best to get your image sizes close to your full size.
  • Click on the Meta Slider tab to create a slideshow.
  • Click on the “Add Slide” button to see the images in your media library. (You can also upload more images at this stage as well.)  Choose the ones you want to include.  Hold down the shift key and select multiple images.  You will see them checked.  Save and preview.  (You can always add or remove more slides later.)
  • Choose a slide type (i.e. Flex, Nivo, Coin, and Responsive) – each has a list “Advanced Settings” for further configurations.
  • meta slider settingsEnter the slide dimension you’ve decided upon. (this should be the largest size you expect to display on your page – it will scale down on different devices)
  • Optionally, add some caption heading and body with links – certain slider types are better for this (Nivo, Flex).  Some HTML is parsed, so you format as needed.
  • To create another slideshow, simply click on the “+” sign in the Slideshow tab.
  • Each slide will have a automatically generated shortcode.  Simply copy and paste into your post or page.

Tutorial

This five minute tutorial should get you up and running quickly:

Hope you enjoy this plugin!

Create Newsletters from Your WP Site with MailPoet

mailpoet

You can create fully configurable newsletters from your Commons WordPress site with the “MailPoet Newsletters” plugin.

MailPoet lets you use WordPress to build rich newsletters, either ad hoc using the familiar WP interface,  or by interacting with existing posts on your site.  You can manually drag and drop posts into a newsletter or schedule weekly or monthly newsletters that automatically pick up your latest content based on category.  Newsletters can include images, links, and social icons, and be designed from a number of templates.

Newsletters are sent directly from your site to lists of subscribers who you build via the plugin interface.  Lists can be derived from those who subscribe to your blog, or manually, or even by importing from a CSV file comprised of “email”,”lastname”, and “firstname” columns.

This is a great way to garner interest in your site and keep subscribers aware of what’s going on.

Getting Started
Once you activate the plugin on your dashboard, go to “Newsletters.”  You will see a basic newsletter template with four sections – you can use or delete any of these sections, or you can elect to use a totally different mailpoet themestemplate or “theme.”  (You can easily upload a number of free “themes” by clicking on “Add more themes” button.)  Drag them over to the canvas and start configuring your newsletter.  To add content from your posts, go to the Content tab and drag the type of content you want over to the canvas.  For example, if you want to add an excerpt from one of your posts, drag the “WordPress post” block over to a text area and drop it.  You will then be presented a list of all posts that you can select from.  Select one and if it has an image, re-size it appropriately by clicking on the lower right corner and expanding or contracting its size.  Other content options include “Title & Text,” “Dividers,” and “Social Icons.”

Once you get the hang of it, it is very easy to design a neat looking newsletter.

There are many “Settings” options that help you further configure your newsletter and email clients, and even a widget that lets viewers auto-subscribe.

Take a look and if you have questions, let us know at WordPress Help!  Enjoy!

 

 

 

ChartBoot for WordPress

chartbootThe ChartBoot for WordPress plugin makes it easy to add a wide variety of charts to your site’s pages and posts.  The available styles depend upon the kind of data you paste into the initial text box.  You can create simple bar charts, line charts and pie charts, or if you include a date and several variables, you can create an interactive “trend” chart.  Each chart can be easily customized with headers, fonts, and colors.

chartboot iconGetting Started

After you activate the plugin, no settings are necessary.  You’ll see that an icon appears on you edit dashboard.  After clicking the icon, a popup screen will appear with four buttons.  See image below:

chartboot API

Follow the four steps below to create a chart:

Imchartboot importport Data

Your data needs to be in some kind of spreadsheet.  Copy the data, including the headers, but you probably will not want the totals.  Paste your data into the text box shown on the right.

chartboot typesSet Types

This screen will automatically show your data field names – use the drop down to configure whether the field is text (“string”), number, or date.

Edit Chart

The plugin does a brief analysis of your data and provides some recommended chart types.  You can pick one of these, or click “More” for more options.  Your data will not support all chart types, and if you pick one that will not work, you’ll get an error message.  When you select a box, your potential chart will appear in a preview box on the right. The subsequent tabs on this screen let you customize a chart to your liking.  Features include heading, font size and family, background colors, and axis choice.  Make your choice and view how they look on the preview box.chartboot edit

Send to WP

This is the final step in the process.  When you click the box, the plugin generates the shortcode that creates your chart.  Make sure you are happy with all the steps above, since you’ll not be able to go back to the plugin’s API to edit your chart once it is generated.  You could try to decipher the shortcode and modify it, if you know what you are doing, but more likely you will find it easier to just start fresh and repeat the steps above.  Here is the shortcode generated for the sample chart:

chartboot shortcode

Google Calendar Events

google calendar eventsThe Google Calendar Events plugin lets you embed one or more Google calendars into your WordPress site, displaying events in a calendar grid, or as a list.   The plugin uses feeds to aggregate events from various sources.

Getting Started

Once activated, the plugin will create a new entry on your Admin “Settings” where you add your calendar feeds.  You can add several here, and later select the ones you want to display on a post or page (using a shortcodes) or in your sidebars using a widget.

feeds

The “Settings” page for the plugin has many more options, including its own “Event Display Builder” which lets you customize how events are displayed when the mouse rolls over a calendar date.  These settings are specific to the individual feed you are working with.  There are many conditional shortcodes that can be implemented here to ensure you display exactly the kind of events you want.  For example, you can customize the feed to only display all day events which are not ended.

calendar3How to Find Your Calendar Feed URL

Go to your Google Calendar.  In Chrome, you’ll probably see it as an option on the toolbar.  Click on the highlighted down-arrow, and then click on “Share this Calendar.”  You will be taken to page where you can make your calendar public.  To use this plugin, your calendar must be public.

Then click on “Calendar Details“, highlighted below:

calendar details On this page you will find a bunch of details about your calendar.  Scroll down the page until you find “Calendar Address.”  Click on the orange “XML” icon.

clickxml

A box will popup containing the feed URL you need.  Copy this and go back to the Google Calendar Events plugin “Settings” page on your WP Admin dashboard.  Go to the “Add a Feed” (pictured above) and paste it into your Feed URL textbox.

Display Events on Posts or Pages, Using a Shortcode

Simply insert the following on a new line to display the default calendar:

[google-calendar-events]

There are four parameters which can be used to customize the appearance:

  •  id – a comma-separated list of the feed IDs you want to display (if this parameter is omitted, if will display all)
  • type – there are four possible values: list(events displayed in a list), list-grouped (events displayed in a list, grouped by date), grid (events displayed in a calendar grid for the current month), and ajax (events displayed in a calendar grid, with the ability to change months via AJAX)
  • title – when you roll your mouse over a calendar date, this will display as the title in the tooltip box that displays the events for the day
  • max – the max number of events to display

Probably the most noteworthy parameter here is type=”ajax”.  If you don’t use that, you will not be able to flip back and forth between months.  Also note that if there are no events in the coming months, the forward arrow will not appear.  (And conversely, if no previous events, the previous arrow will not show).

Example:
[google-calendar-events id=”1, 3″ type=”ajax” title=”Events on” max=”10″]

gce widgetDisplay Events Using a Widget

Once activated, you’ll notice that a widget called “Google Calendar Events” has been added.  Simply drag it over to the widget area of your choosing and configure. The widget provides the same options available with the shortcodes, described above.

Styling Your Event Calendars

If you want to take a shot at changing the way your calendar looks, and know a little CSS, you can play around with plugin’s stylesheet, attached below.  It’s pretty well documented.  Find the particular rule you want to override and paste it into Appearance>>Custom User CSS.

.gce-page-grid .gce-calendar .gce-caption{ /* Caption at top of calendar */ color:#333333; text-align:center; }

.gce-page-grid .gce-calendar{ /* Main calendar table */ width:100%; border-collapse:collapse; border:1px solid #CCCCCC; color:#CCCCCC; }

.gce-page-grid .gce-calendar th{ /* Day headings (S, M etc.) */ border:1px solid #CCCCCC; text-align:center; width:14.29%; padding:0; }

.gce-page-grid .gce-calendar td{ /* Day table cells */ border:1px solid #CCCCCC; text-align:center; height:80px; vertical-align:middle; padding:0; }

.gce-page-grid .gce-calendar .gce-has-events{ /* Table cells with events */ color:#333333; cursor:pointer; }

.gce-page-grid .gce-calendar .gce-event-info{ /* Event information */ display:none; /* Important! */ }

.gce-page-grid .gce-calendar .gce-day-number{ /* Day number span */ font-size:2em; }

.gce-page-grid .gce-calendar .gce-today{ /* Table cell that represents today */ background-color:#DDDDDD; }

.gce-page-grid .gce-calendar .gce-next, .gce-page-grid .gce-calendar .gce-prev{ /* Previous and next month links */ cursor:pointer; display:inline-block; width:3%; }

.gce-page-grid .gce-calendar .gce-month-title{ /* Month title */ display:inline-block; width:90%; } .gce-page-grid .gce-calendar th abbr{ /* Day letter abbreviation */ border-bottom:none; } /* PAGE LIST */

.gce-page-list .gce-list p{ /* Each piece of information in the list */ margin:0; }

.gce-page-list .gce-list p span, .gce-page-list .gce-list div span{ /* The text displayed before each piece of info, \’Starts:\’ for example */ color:#999999; }

.gce-page-list .gce-list .gce-list-event{ /* The event title */ background-color:#DDDDDD; } .gce-page-list .gce-list .gce-list-title{ /* The title (not the same as event title) */ font-weight:bold; }

.gce-page-list .gce-list ul{ list-style-type:none; margin:0; padding:0; } /* WIDGET GRID */

.gce-widget-grid .gce-calendar .gce-caption{ text-align:center; }

.gce-widget-grid .gce-calendar{ /* Main calendar table */ width:100%; border:1px solid #CCCCCC; border-collapse:collapse; }

.gce-widget-grid .gce-calendar th{ /* Day headings (S, M etc.) */ width:14.29%; border:1px solid #CCCCCC; text-align:center; }

.gce-widget-grid .gce-calendar td{ /* Day table cells */ color:#CCCCCC; width:14.29%; border:1px solid #CCCCCC; text-align:center; }

.gce-widget-grid .gce-calendar .gce-has-events{ /* Table cells with events */ cursor:pointer; color:#666666; }

.gce-widget-grid .gce-calendar .gce-today{ /* Table cell that represents today */ background-color:#DDDDDD; }

.gce-widget-grid .gce-calendar .gce-event-info{ /* Event information */ display:none; /* Important! */ }

.gce-widget-grid .gce-calendar .gce-next, .gce-widget-grid .gce-calendar .gce-prev{ /* Prev and next month links */ cursor:pointer; display:inline-block; width:5%; }

.gce-widget-grid .gce-calendar .gce-month-title{ /* Month title in caption at top of table */ display:inline-block; width:80%; }

.gce-widget-grid .gce-calendar th abbr{ /* Day name abbreviations */ border-bottom:none; } /* WIDGET LIST */

.gce-widget-list .gce-list p{ /* Each piece of information in the list */ margin:0; }

.gce-widget-list .gce-list p span, .gce-widget-list .gce-list div span{ /* The text displayed before each piece of info, \’Starts:\’ for example */ color:#999999; }

.gce-widget-list .gce-list .gce-list-event{ /* The event title */ background-color:#DDDDDD; }

.gce-widget-list .gce-list .gce-list-title{ /* The title (not the same as event title) */ font-weight:bold; }

.gce-widget-list .gce-list ul{ list-style-type:none; margin:0; padding:0; } /* TOOLTIP */

.gce-event-info{ /* Tooltip container */ background-color:#FFFFFF; border:1px solid #333333; max-width:300px; }

.gce-event-info .gce-tooltip-title{ /* \’Events on…\’ text */ margin:5px; font-weight:bold; font-size:1.2em; }

.gce-event-info ul{ /* Events list */ padding:0; margin:5px; list-style-type:none; } .gce-event-info ul li{ /* Event list item */ margin:10px 0 0 0; }

.gce-event-info ul li p{ /* Each piece of information */ margin:0; }

.gce-event-info ul li p span, .gce-event-info ul li div span{ /* The text displayed before each piece of info, \’Starts:\’ for example */ color:#999999; }

.gce-event-info .gce-tooltip-event{ /* The event title */ background-color:#DDDDDD; font-weight:bold;

List Pages Shortcode

flicker_poles_6594723627_6e3dcf6137_zThe List Pages Shortcode plugin comes in handy if your site has a lot of pages and you want a quick way to make them accessible.  As its name suggests, it provides an easy-to-use shortcode with a bunch of optional parameters to list out links to your pages. Just type in the shortcode on a new line on the page where you want the list to appear.

You can exclude pages from the list, you can only show “child” pages of the current page, and specify how deep your want to go (grandchildren, great-grandchildren…), or you can only show siblings of the current page (pages with common ancestor pages).  You can sort the list according to specified fields (post_author, post_title, ID, post_date, etc. ).  And you can include a page excerpt (excerpt=”1″).  This plugin works well with the “Page Excerpt” plugin, which allows you to create a excerpt that summarizes and teases your readers to explore the page.  To exclude the current page, use exclude_current_page=”1″.  If you plan to do some custom styling of your list using CSS, you can add a class (class=”my_page_list”).

Here are some sample ways to use the shortcode:

listpagesAnd here are some of the parameters that you can use:

listpages2

An explanation of how to use these parameters can be found here.

This plugin is a great way to organize and manage content on your site.

WP Post to PDF

postToPdfThe WP Post to PDF plugin lets your readers download your page or post content to a PDF.  You can control if this function should be available to everyone, or just to logged in users.  Installation is a snap.  The plugin adds an entry to your admin dashboard “Settings” called postpdf1“WP Post to PDF.”  Here you can configure the plugin to your liking.  You can determine what pages and posts you want the PDF export icon to appear, and how it should look like.  You can exclude pages and posts, and determine how to display author information.

The plugin has a default logo that is easily changed on a single site installation, but which is problematic to configure on the Commons.  Follow this post to see if there is a resolution, or stay tuned.  Maybe we can globally replace it with the Commons Logo, or simply not display it.replaceLogoWhen installed, your page or post will look something like the screenshot below.  Just click on the icon to download a PDF version.
pdf samp

And the downloaded PDF will look like this, depending on how your configure your layout:
sample pdf

Column Shortcodes

column shortcodesColumn Shortcodes is a plugin that lets you divide your post or page content into columns wherever you want, using easy to use shortcodes.  You can swap in and out of various column layouts (there are eleven to choose from).

column icon2Once installed, the plugin adds an icon to your edit dashboard.  Click on the icon and choose a layout.  Enclose the content between the two parts of the automatically generated shortcode, and continue across the row.  If you choose, you can end the row with the “(last)” shortcode.

column shortcs

This is an easy way to create interesting layouts for your pages and posts.  The plugin also provides a way to add padding to columns.  Be sure to enter the padding first (put your cursor on the box, and add a pixel value for the padding) if you need it, and then select a column shortcode.

column options

Next Page Buttons Plugin

flickr_bulb_7232992872_a756e282d4_zThe NextPage Buttons plugin lets you break up your post or page content into pages.  This is functionality that was once in WordPress core, but was removed.  So use this plugin with the knowledge that it might not work forever.  It is easy to use, though it is a manual procedure.  Scroll through your page and post, and where you want to break into a new page, simply click the “Next Page” icon pictured below:

nextbuttonsiconYour content will be broken up into pages, and at the bottom of each page you will see navigation buttons like these:

nextButtonsClicking on “Single Page” will break the pagination and display all your content on one page.  You can scroll throughout.  But clicking back on a page number will reverse this, and break your content into pages.

EasyRotator for WordPress

easyrotatorThe Easy Rotator for WordPress plugin provides an easy way to add a customizable slider to a page or post, or to a widget area.  You can add as many distinct sliders as you want to your site, and use many different template styles.  Animation can be customized for each separate slider, and depending upon the template you choose, text and links can be added to suit your needs.  This is a great plugin to use if you’re using a basic theme like Twenty Twelve and want to embellish your content with some dynamic images.  Pictures can be selected from your computer, your WP media collection, or from the images you set as “featured” on your posts.

In case you are wondering, a slider is a set of images that cycle through your page, post, or most probably, your home page.  In most cases, you can configure your slider to fade or slide, and link to a page or post that is displayed.  You can configure how long the image stays on the page, and you can control what text should overlay the image (if any).   Sliders are a good way to showcase the contents of your site. 

Getting Started

Setup is a little different for this plugin.  Once activated, you should see the following box at the top of your dashboard:

easyrotatorInstall2Click on the install button, and follow the instructions to install EasyRotator’s editor application onto your computer.  This also involves installing Adobe Air.  This one time process takes a couple minutes to complete.  Once done, you will see a new icon when you go to edit a page or posteasyrotatorbutton.  Click on the button to add a new rotator or to edit an existing one.

Getting Help

easyrotatorhelp1This plugin comes with a great help panel which can be accessed from your dashboard menu under EasyRotator tab.  It includes screenshots of the various screens you’ll need to use to set up the API and to create and customize your sliders.  It may seem overwhelming at first, but I think you’ll find the plugin is fairly easy to use and awesome in what it can do.  The plugin comes with a premium “Pro” version which the Commons currently does not support.  And it also includes a widget that you can use in your sidebar.

Page Excerpt

excerpt_3421668561_4e72589586_mThe Page Excerpt plugin gives pages the same excerpt functionality as posts.  Excerpts are “optional, handcrafted summaries” that can tease your readers into exploring your content further.  After installing this plugin, a new text box will be added to your “Page Edit” dashboard.   If you don’t see it, click on “Screen Options” and ensure that the checkbox entitled “Excerpt” is checked.  See screenshot below:

excerpt1

Scroll down on your “Edit Page” and you should see the following:

excerpt2
You can add text, but if you want to include images or links, you’ll have to do so with HTML.

So how is the page excerpt displayed?

If you have developed a child theme on the Commons, you can include (and customize) the following PHP code into one of your templates to display page excerpts:

<?php the_excerpt(); ?>

But more likely you’ll use “Page Excerpt”  in conjunction with another plugin that is available on the Commons – “List Pages Shortcode.”  As its name suggests, this plugin lets you use a shortcode to list selected pages (and optionally their excerpts).  For more information, see List Pages Shortcode on the Commons Codex.

Leaflet Maps Marker

leafletThe Leaftlet Maps Marker is a really neat plugin that lets you easily pin, annotate, organize, and share locations using maps from Google,  Bing, and OpenStreetMap.   Using integrated address searches, you can easily locate sites, pin them with hundreds of different pin icons, add popups for each site that include images and text, size, zoom and layer.  You can use shortcodes to easily include your map in any post or page.  And you can include directions and make your locations available via RSS feeds (actually via GeoRSS).

This is a great tool for research, teaching and travel journalism.

Once activated, the plugin creates a new tab on your dashboard called “Maps Marker.”  It’s pretty easy to get started creating a map and using its shortcode to embed it into a post or page.  There are hundreds of options, and mapping APIs, but the basic learning curve doesn’t seem too bad.

Below is an example of what you can do.  If this was an actual embed, you would be able to click on the pins to popup its annotations and associated images.

leaf

Constant Contact for WordPress

constant contactThe Constant Contact for WordPress plugin is an app that integrates with your Constant Contact account. Constant Contact is a proprietary service which provides email marketing, online event management, social campaign management, online polls and survey functionality.You can get a free 60-day trial account.  You’ll need an active account to get this plugin going on your site.  Here is a synopsis of the plugin’s features, taken from its WP Repository site:

  • Add signup checkbox and list selection to your register page and update profile page
  • Add / edit contact lists without visiting www.constantcontact.com
  • Includes a powerful form designer
  • Built-in Google Analytics visualization
  • View your events registration details and get updated with a dashboard widget
  • Show contact list selection on register page with ability to exclude certain lists
  • Automatically subscribe your user to one or more contact lists on the register page
  • Customize the register page signup box (and list selection) title and description
  • Add / edit users from your Constant Contact account
  • Add a signup widget to your sidebar or anywhere in your template

This plugin may be useful to plan and manage your campus events, conferences, and speaker series.  Also you might want to check out the non-proprietary Events Manager plugin and compare functionality.

 

Event Marketing

The plugin features Constant Contact Event Marketing functionality by allowing you to track events, registration, and registrants using the plugin. Simply navigate to Constant Contact > Events. Manage your events from inside WordPress!

Built-in Form Designer

The Form Designer is a form generation and design tool. The Form Designer allows users to generate unlimited number of unique forms and gives a wide variety of options that can be configured, including what fields to show in the signup form. There and tons of design options, including custom background images, border width, colors, fonts and much more.

Twitter Mentions As Comments

twitter mentionsThe Twitter Mentions As Comments plugin is a neat way to harvest all the tweets referring to your WordPress posts and display them as comments on your site.  The workflow is identical to the comment workflow on your site, and is controlled in Settings>>Discussion.  You configure how notifications, comment moderation, and author whitelists/blacklists work.  The plugin gets the poster’s real name and profile picture and links directly to the original Tweet.  And best of all, it does it automatically.

After activating the plugin, you’ll notice an entry added to your Dashboard Settings tab.  Here you can control the way the plugin operates:

twitterMentionsSettings

If you tweet about your posts, you might what to blacklist your own Twitter account to avoid getting comments from yourself.

For support, check out the plugin’s site on GitHub.

WordPress Google Fonts

googleFontsThe WP Google Fonts plugin is a great way to add different fonts to your site. Many premium themes provide built in font functionality, making this plugin unnecessary.  But for many standard themes, you’ll need a plugin like this one if you want to take advantage of the vast collection of fonts that are available.  To learn more about Google Fonts, check out the Google Font Directory website.

After activating the plugin, you will see an entry has been added to your dashboard settings tab.  Click on it and start adding fonts that you might want to use.  The plugin provides space to add up to six different fonts.

googlefontssettings

Using the form above and checking off elements for the fonts seems to work fine for themes like Twenty Twelve, but at the bottom of the Settings page the plugin provides a little more information about how to configure font use if you find this method has no effect (or if you want to apply fonts to specific posts or paragraphs, etc.) :

Most likely the theme you are using has defined very specific elements in its stylesheet and these may override the generic tags specified above. If you don’t see any changes after checking the style boxes above, you will need to enter custom css into the CSS box. An example of CSS that would be more specific would be:

#container p { font-family: ‘Reenie Beanie’, arial, sans-serif; }

This would define all paragraphs found within a <div id=”container”></div> element. Stylesheets (CSS) can be sensitive and tricky sometimes. If you are new to CSS the w3schools tutorials are a great place to start.

Pinterest Pinboard Widget

pinterest Pinterest Pinboard Widget provides an easy way to integrate Pinterest content into your WordPress site.  Easy to use and to configure, the widget displays content from your Pinterest account, someone elses account, or from the generic “pinterest” account.  Clicking on an image in the sidebar will take you directly to Pinterest site and the pin.  There is an option in the widget to open in a new window to make it easy for your readers to go back to your site.pinterestSettings

This can be used to display recent pins from organizations related to your site.  For example, the Graduate Center has a Pinterest board, and if you paste its account (“gradcenternews”) into the widget configuration, your site will display its most recent pins.

Below is a screenshot of what would appear in your sidebar, using the example configurations.

pins

Regenerate Thumbnails

The Regenerate Thumbnails plugin comes in handy if you want to easily re-size an image’s thumbnail or a set of images’ thumbnails. Simply go to Settings>>Media and change the default size for your thumbnails.

imageSizes

Then you have three ways to use this tool:

  • Go to Tools>>Regen. Thumbnails and change the thumbnail size of your entire collection of images; or
  • Go to Media>>Library and select each image that you want to change by checking its box. Then select “Bulk Actions” and “Regeneration Thumbnails” and click Apply; or
  • Do one image at a time. Hover your mouse over the title of your image. You will see a new option is available called “Regenerate Thumbnail.” Click on the hyperlink, and your thumbnail will be resized.
Regenerating thumbnails individually.

Regenerating thumbnails individually.

If you have posts that are explicitly using the thumbnail size of an image (i.e. have a “hardcoded” url reference), you will have to manually update to the new url.

But if your theme uses thumbnail images automatically when it lists your posts on your home page or on your category archive pages, these will be re-sized automatically. Thumbnails on gallery pages will also be automatically updated.

Some of the themes (especially the premium themes) on the Commons have dynamic resizing functionality built in, and might have a more convenient method for resizing thumbnails. Perhaps this regenplugin won’t be used that often, but it’s good to know that if you are changing themes and things are not looking quite right, or just decide you want to change your thumbnail dimensions, this plugin is ready to use on the Commons, and can save you a massive amount of time. It also has a great support page and the developer is very responsive to questions.

Super RSS Reader

super RSSSuper RSS Reader is new on the list of RSS plugins for the Commons. It is a widget that can easily be placed in your sidebar to display up to five different feeds in a single area. Each feed appears as a tab, and you can easily control how many items are displayed.

What sets this widget off from the others we have installed on the Commons is it’s “ticker animation” feature. You can set the feed to refresh after a configurable number of seconds and control how many items in total you want to display. So for example, if you want to display 5 items at a time in your sidebar, and you want to include the last 15 items in your feed, and you set your screen to refresh after every 4 seconds, you will see three sets of items before they start repeating 12 seconds later.

Configurations

Configurations

Twitter feeds look nice when displayed using this method. (The url for a Twitter feed is – https://api.twitter.com/1/statuses/user_timeline.rss?screen_name=xxx – where xxx is the Twittter user name.)

If you find the news ticker animation effect distracting, you can simply shut it off by de-selecting one check box in the configuration (see above).

Super RSS Reader is purely a widget and all settings are controlled from the widget configuration dialog shown above. If you are looking to display feeds in pages or posts, you can use WP-RSS Import which is also available on the Commons, and which comes with a lot of configurable attributes, and controlled with shortcodes.

Statistics For Your Site

It’s great to quantify your readership, and there are a couple plugins on the Commons that provide interesting statistics, and there is also Google Analytics (see below) , which is perhaps the best at gathering what’s happening on your site.

Google Analytics

Google Analytics is installed on the Commons site-wide, and provides a wide variety of statistics for individual sites. Follow this link to see how it works. Contact us at commons@gc.cuny.edu, and we’ll set you up to receive activity emails on a daily, weekly, or monthly schedule. Activity is provided in a spreadsheet or PDF, broken down by Pageviews, Unique Pageviews, Average Time per Visit, Bounce Percentage, and Exit Percentage. There’s a lot of customization possible.

Since we have Google Analytics running site-wide, we don’t provide widgets to display individual site stats – you’ll need to receive data via email.

JetPack

One of the plugins that’s included in JetPack is called “Stats” and it presents readership data in various graphs, in your dashboard, as shown below:

The Admin bar has a simple graph showing activity, and when clicked, takes you to full details.

StatPress Visitors

The StatPress Visitors plugin was recently installed on the Commons, and comes with two sidebar widgets to display statistics. One shows the most popular posts and pages on your blog and the other shows statistics for today – number of visitors currently online, users logged on, etc.

From your dashboard you can retrieve a lot of detailed information, including statistics about bots, spiders, subscriptions to RSS feeds, popular pages, unique visitors, page views, browser and operating systems, IP addresses, etc.

This is a neat plugin with a lot of bells and whistles, and one worth checking out. Check out their Flickr slideshow:

Events Manager Plugin

If you have a WordPress site on the Commons and frequently announce or organize events, check out the Events Manager plugin. It is a neat way to manage and display upcoming lectures, seminars, conferences, meetings, etc. Each event is nicely displayed on its own separate page with an automatically generated Google map pointing to its location. Events can be categorized and tagged, and can be displayed in your site’s sidebar using widgets that itemize them in a bulletted list, or in an interactive calendar. You may also use shortcodes on pages or posts to display all or selected events. This is a great way to organize the way your site displays upcoming events.

Getting Started

Go to Plugins and activate the “Events Manager” plugin, using the usual procedure. You will notice a new tab on the left-hand side of you dashboard called “Events.” (You’ll also see that the plugin author has included three test events for demo purposes. You’ll want to get rid of these after you get the hang of how the plugin works.) Click on “Add Event” to add your first event. There are seven basic attributes for each event. Only the first two are required: (1) title; (2) date; (3) location; (4) description; (5) thumbnail image; (6) tags & categories; and (7) enable bookings. If you don’t give your event a location, the Google map will (obviously) not appear. If you enable bookings, you can let your users register for the event, and manage tickets and seats. Click here for more info on bookings.

Here is a screenshot of how an event may appear on your site:

Widgets and Shortcodes

The plugin has two widgets, one called “Events” and the other called “Events Calendar.” Simply drag and drop these into your sidebar to give your readers quick access to the events you want them to know about. There are also many shortcodes which can be used on individual posts and pages to list and aggregate events by tags and categories. Here is a page explaining the shortcodes and their implementations. Shortcodes can be used to create detailed calendars of events, or styled lists with thumbnail images.

Settings and Documentation

There are tons of settings possible. One immediate change you might want to make is to switch the date display from European style to month/day/year. The plugin has great documentation and its own demo site. As the author notes about the demo site:

This website is only a small example of what’s possible with this plugin. With all the formatting options and event settings in the admin area, you can style and format events to look the way you want them!

Anthologize

Grab, Craft, and Publish

Anthologize is a powerful tool that lets you “grab” blog posts from your site or from an RSS feed, “craft” your content into a single document, with a title page, table of contents, and chapters, and “publish” it in one of five digital formats.

The plugin is easy to use, and very well documented. Here is the basic workflow: (1) create a project; (2) manage its “parts” by creating chapters, and dragging post content into each; (3) set up optional fields such as author(s), publish date, copyright type, edition, dedication, and acknowledgements; (4) pick a fontsize, a font family, an optional front page image, and whether or not to include the Anthologize “colophon” page; (5) pick an export format – either PDF, RTF, ePub, HTML, or Anthologize TEI; and (6) export your new anthology to a file on your computer.

You can always reorder your content by dragging items up or down. You can make changes to the title page and simply regenerate the export file until you get it right.

If you choose to grab content outside your blog, you will need to copy that content’s RSS feed URL and paste it into a text box. Then hit import and the external content will automatically appear with the rest of your content, and you can just drag and drop it into the chapters of your anthology. If you are using RSS feeds, please respect copyright. (RSS feed posts are copied in draft form into a new tab on your dashboard called “Imported Items” and can be edited, if needed.)

Images and links from your posts are preserved in your anthology.

History of the Project

Anthologize was a project of One Week | One Tool, “a unique summer institute … that aims to teach participants how to build an open source digital tool for humanities scholarship by actually building a tool, from inception to launch, in a week.” Funded by the National Endowment for the Humanities and hosted by the Center for History and New Media, George Mason University, the project brought together twelve digital humanists (including @boonebgorges) who collaborated to build Anthologize. Follow @anthologize.

Google Docs Embed Plugin

If you are a Google Docs user, you may want to check out the great new plugin that Ray Hoh developed for the Commons.  Google Docs Embed lets you embed your Google documents, presentations, spreadsheets, and forms directly into WordPress posts and pages.  Once embedded, you can continue to make changes in Google Docs, and your changes will be automatically reflected on your WordPress site.

Getting Started

Login into your Google account, and find the item you want to embed.  First, you’ll need its public url.  In Google Docs, go to “File>>Publish to the Web”.  A dialogue box should appear, similar to the one below:

Make sure that the “Automatically republish when changes are made” checkbox is checked.  This will allow you to make changes to your Google Docs and have theses changes automatically reflected on your WordPress site.

Copy the “Document Link,” highlighted in red, above.

Now go to your WordPress dashboard, and open up the post or page where you want to embed your document.  On a new line, type the following shortcode:

There are other custom parameters you can use in the shortcode exression.  Here is a description of them all:

  • “width” – By default, this tries to use the current theme’s content width. If this doesn’t exist, the width is “100%”. Fill in this value to enter a custom width.
  • “height” – Enter in a custom height for your Google Doc if desired.  Avoid percentages
  • “size” – This parameter is only applicable to Presentations. You can enter in ‘small’, ‘medium’ or ‘large’. To set a custom width and height, use the ‘width’ and ‘height’ parameters listed above instead.
  • seamless=”0” – use this parameter if you want to see the Google Docs header and footer

This plugin is very powerful when used with Google Forms.  You can set up a Google Form, embed it on your WordPress site, and have your readers enter data, and the data which they enter will be collected in a spreadsheet on your Google Drive.

VeriteCo Timeline plugin

The VeriteCo Timeline plugin is a powerful tool for creating visual timelines that can be embedded directly into your site’s pages and posts.  Each timeline entry can include (besides date and textual information), embedded images from Flickr, tweets from Twitter, video embeds from YouTube, DailyMotion, or Vimeo, articles from Wikipedia, sound from SoundCloud and map embeds from Google Maps.  You can easily control the width and height of your timeline using Verite’s API.  Before describing the process of creating a timeline, here is an example:

Check out more examples of user created timelines at VeriteCo’s site to get some ideas of what you can do.

The easiest way to create your own timeline is to copy the Google Doc spreadsheet template into your Google Docs, and modify it.  To do this, first sign into Google Docs, then click on the box called “Google Doc Template” found on this page.  Save the spreadsheet template to your drive, and start changing it.  The spreadsheet has seven columns.  Only two are required, the start date and the headline.  Follow the pattern used in the template, and you should be good to go.

The next step is to publish your spreadsheet to the web and copy the url that is generated for you.  Then go to Verite’s “Embed Generator” and paste in your spreadsheets web url and check the box that says “WordPress plugin.”  Optionally, you can select the width and height of your timeline, which type of map, font, and language to use.  Once you are done, simply copy the embed code and paste it into a page or post on your site.

And of course, don’t forget to activate the VeriteCo Timeline plugin on your site.

Creative Commons License

css.php
Need help with the Commons? Visit our
help page
Send us a message
Skip to toolbar