CSS for Resizing Video
Just a handy chunk of CSS to make your video embeds behave better. It’s out there but not a bad thing to spread farther.
Our Sociology Department Chair, Jennifer Johnson, is out there leading the way for the Sociology Department at VCU. She’s not only thinking through how syndication will impact the design of their entire program and curriculum (online and off), she’s also teaching a course on Sociological Theory in a way that shows how student work can interweave in interesting ways. There is a real focus on interaction between undergraduate and graduate students and the idea that the student work will be centered around the theorists themselves. The site reflects a number of those choices and it’s going to be fun to watch it grow. They’ve already got upwards of 90 posts and we haven’t even finished the second full week of classes. The site is a basic mother blog setup with a few tweaks. You’ll notice the landing page is a basic grid layout with the theorists images linking to the categories. So the Max image links to http://rampages.us/sociologicaltheory/category/marx/.Do note that this requires an agreement to use the same categories. In this case, simply using the last name of the theorist. Most themes don’t really encourage this particular layout. There are plugins that will allow you to give categories “Featured Images” like posts have. In this case that felt like more trouble than it was worth as I’d also have to […]
That beautiful link-bait title and a picture of a dead leaf! That’s why I’m a social media guru. With that self-promotion out of the way . . . I found this CSS library from Una.Check out her site if you’re into developer stuff at all. It lets you apply instagram-like filters to image via CSS. Also got to have a nice interaction with Una via Twitter to clarify the license. @twoodwar :+1: its MIT so go ahead — Una Kravets (@Una) December 6, 2016 It fit a need that a professor was expressing for one of our WordPress installs so I wrapped it in a plugin/shortcode combination. The structure goes like so . . . [ cssgram img=”https://c2.staticflickr.com/6/5745/31413304786_48ab865a34_c.jpg” filter=”_1977″ ] Plain Image A Few Filtered Examples _1977 Inkwell Xpro2
There are a bunch of these out there but the ones I knew of didn’t quite do what was needed by the Focused Inquiry faculty involved in this project. They wanted a couple things to be possible. The ability to link to specific elements via URL and have them expand. The URL to those elements to remain consistent even if the order of the elements was changed. An “email this URL” link to enable faculty to send the URL to students Plus/Minus indicators based on expanded/collapsed. Most shortcode plugins I’ve seen either don’t have an ID for the collapse element or make it sequential (which changes if you shift the order). Neither works well for a URL that needs to be consistent. I’ve never seen one to do the email element. In my head, I made this way harder than it needed to be. It ends up being just two shortcodes- one for the collapsible container and one for the item-level elements. I found this Bootstrap snippet that did most of the functional Bootstrap stuff that I needed. I found a script to let me expand elements via URL parameters. I reminded myself what a freaking mailto link structure looked like. Now I just had to figure out what variables needed to be set in the shortcode and how the […]