In the Spotlight: Embedding Images with the Block Editor

Many of you are probably getting used to the new(ish) Block Editor this semester. The Classic editor will be supported by WordPress through at least 2022, but we encourage you to gain some familiarity with the Block editor now before the alternative becomes obsolete. One of the advantages of the Block editor is that it makes it easier to integrate text with visual page elements, without any coding needed. It can be especially useful if you have an image-rich site, as it allows you to embed media hosted on external sites (e.g. Dropbox, Google Drive, your own personal site) and therefore can help you save some of that precious OpenLab storage space! In the remainder of this post, I spotlight how to 1) upload and embed an image to your post; 2) embed externally-hosted image. 

Upload and Embed Images

To upload and embed an image to your page/ post follow these steps:

1. To upload images or other media (e.g. pdfs, Word docs, txt files) to a post or a page, go to your Dashboard > Posts > Add New or Pages > Add New.  Click the Add block button. A block library will appear: click Image to add an image to your page or post.

2. You can select files saved to your computer or flash drive by clicking Upload. Then, either drag-and-drop files from saved to your computer or select a file.  You also have the option to select an image or other files from your media library by clicking the Media Library tab, or inserting an image from a URL by clicking the Insert from URL tab.

3. Once you have uploaded or inserted your image, you can make adjustments to the file using the options in the block toolbar.  You can add a caption to appear underneath the image, change the “Alignment” of the image, and choose between the default rectangular style and a rounded image style. You can change the “Size” of the image by dragging its edges.

Embed Externally-Hosted Images

Please note that each site has a size limit and unnecessarily large images can take up more of your space than you’d like. If you are sharing many large images, we suggest hosting them with an external storage solution, such as Google Drive, Dropbox, or Flickr, among others. Instructions for embedding externally hosted images are as follows:

  1. On the “Add New Post” or “Add New Page” screen, click the Add block button. A block library will appear: click Image to add an image to your page or post.

2. Click Insert from URL.  Paste or type the URL for the image.

3. Click enter or the black arrow to Insert into Post.

4. Once you have inserted your image, you can make adjustments to the file using the options in the block toolbar.  You can add a caption to appear underneath the image and change the “Alignment” of the image. 

Want to try your hand at the Block editor? Please visit our Help documentation to learn more!

Sources:

This page is a derivative of “OpenLab Help” used under CC-BY-NC-SA 3.0.

In the Spotlight: Advanced Accordions

This week we spotlight Accordions, which can now be easily added to your site with the PublishPress Blocks plugin. Those of you who have worked on the OpenLab a while know that we advocate keeping content on a single page brief. It is always easier for the reader to digest information in smaller chunks, and pages or posts that are text heavy can be visually overwhelming. Accordions are a great way to keep a page/ post short, while still making available additional information that might be useful to your reader. 

But, first, you might be wondering: what are accordions? And how can I create them?

Accordions are collapsible lists: the header for each item on the list is always displayed, but the text and multimedia below the header can be opened and closed. For example, in the image below, the Experiential Art & Design club features an FAQ accordion at the bottom of their home page. Each accordion item takes the form of one FAQ, such as “Do I need to bring a laptop?” When you click the question, the accordion expands, and the answer becomes visible. This is a great way for the club to save space; it also invites the reader to interact with their site!

To create an accordion of this kind, first activate the  PublishPress Blocks plugin in your Dashboard. Then, in your page/ post editor, select the Advanced Accordion block. You now have a fully customizable accordion! The block settings that appear on your right allow you to do things like change the icon of the accordion, the color of the header, the size of the font, etc. Note that beneath each header you can include images as well as text.

We encourage you to play around with Advanced Accordions. While you probably won’t want to hide crucial information in an accordion (e.g. an assignment prompt), they can be a great space-saving design tool for information that might be thought of as “additional” or “further reading.” 

Do you already use accordions on your site? What are some of your use-cases?

In the Spotlight: The Spring 2021 Semester, In Review

Photo by Federico Respini on Unsplash

Summer greetings from the OpenLab and congratulations to all on the closing of another semester! A special congratulations to the class of 2021!

While our weekly “Spotlight” blog series will go on hiatus for the summer, we wanted to remind you of the sites we featured this past semester, and encourage you to check them out if you haven’t already done so.

Spring 2021 Spotlight Posts

This past year, we released a series of OpenLab screencasts, providing audiovisual guidance to using different features of the OpenLab.

In addition to reviewing these posts from this past spring, you can find a full curated list of all sites that have been spotlighted in our  Spotlight Archive. This archive offers visitors 3 curated lists to help them sort through the posts:

  1. For everyone (By type of site – course, project, club, portfolio)
  2. For faculty/staff
  3. For students

As always, we also encourage you to check out our in-house sites:

The OpenLab Community Team will continue to offer email support over the summer– please contact us with questions or concerns.

We will also soon announce our summer programming, including one-on-one office hours. We will be in touch as we get more events and workshops on our calendar!

Wishing you all a very happy summer!

The OpenLab Community Team

New OpenLab Screencast: Pages and Posts

We are pleased to offer a new set of support materials for OpenLab users: screencasts! With video, audio, and captions, these screencasts provide step-by-step instructions for how to use different OpenLab features in a multimodal format.

Today, we’re introducing a new video in our series on the basic building blocks of OpenLab sites. In this one, we’ll focus on how to create pages and posts. This series could be particularly useful for students creating eportfolios in the second half of the semester, for staff beginning new projects, or for faculty designing course sites for the winter term.

To see our other screencasts, click here or visit our YouTube channel.

In the Spotlight: OpenLab Mobile Shortcuts

This week, we spotlight a feature built into most smartphones that can facilitate mobile work on the OpenLab! 

At our workshops, people sometimes ask if we can develop an OpenLab app, similar to the Blackboard app. They say they are pleased with the OpenLab’s mobile functionality, but it’s a pain to have to pull up your phone browser, then navigate to the OpenLab, then navigate to where you want to go. An app on the home screen would provide a handy shortcut. Luckily, you can do that already! 

While app development is not currently in the works, there’s a very easy way to create your own shortcut to the OpenLab on your phone’s home screen. In this post, we will outline how to do it on both iOS and Android. 

Creating an OpenLab Mobile Shortcut on iPhones

  1. Navigate in your phone browser (usually Safari, unless you use another browser) to the OpenLab page you want to create the shortcut to. This might be the OpenLab home page, or your own profile, or the profile or site of a particular course.
  2. Scroll up so that the bottom menu appears, revealing the forward/back buttons, the bookmark button, the share button, and the “view all tabs” button. (See Screenshot 1) 

    Illustration of Steps 1 and 2
    Screenshot 1: OpenLab on mobile with Safari navigation menu visible
  3. Click on the “Share” button. It looks like a square with an arrow pointing upwards out of it. (See Screenshot 2)

    Illustration of where the Share button is on iOS Safari
    Screenshot 2: Share Button circled in yellow.
  4. Scroll down until you see the option “Add to Home Screen.” Click on it! (See Screenshot 3)

    Screenshot of menu that appears when the Share button is clicked, with "Add to Home Screen" circled
    Screenshot 3: “Add to Home Screen” option in Sharing menu
  5. Adjust the name of the shortcut if you wish.
  6. Click “Add.” Now the shortcut to the page will appear as an icon along with your apps! You can delete it or move it around like you can with any of your apps. (See Screenshot 4) 

    iPhone app screen with shortcut to the OpenLab circled in orange
    Screenshot 4: Your new shortcut to the OpenLab

    Creating an OpenLab Mobile Shortcut on Android

    1. Navigate in your phone browser to the OpenLab page you want to create the shortcut to. This might be the OpenLab home page, or your own profile, or the profile or site of a particular course.
    2. Tap the “menu” button on your phone. (The Square button of the three white shapes pictured in Screenshot 1)

      Image of navigation buttons on an Android phone
      Screenshot 1: Android navigation buttons
    3. Then click “Add to homescreen.”

      Image of the menu that appears after Step 2 is completed
      Screenshot 2: Menu for webpage with “Add to Home screen” option
    4. Change the name of the shortcut if you wish, and then click “Add.”
       

      Screenshot of dialog box that allows user to change the name of the shortcut
      Screenshot 3: Name change dialog box

      5. Now you will see a shortcut to your OpenLab page!

Screenshot of Android home screen with OpenLab shortcut visible

We hope this helps you use the OpenLab even more easily on mobile platforms. Many CUNY students, as well as faculty and staff, use their phones for academic work, and creating a shortcut (or more than one!) to the OpenLab can make that work even more streamlined.

In the Spotlight: Inviting Students to your Course!

Happy second week of school to all City Tech faculty, students, and staff! At the start of every semester, faculty ask us how they can get their students set up on the OpenLab for the very first time.  The process can feel intimidating! But below, I spotlight three easy ways that you, as an instructor, can invite your students to join your course.

Have your students join your course in class!

If your course and profile are public, then students should be able to search for your course on the OpenLab. Once they’ve found it, they can join simply by clicking “Join Now.”

A screenshot of an OpenLab course profile page, which includes a course avatar and a button that reads "Join Now." Students can join the course by clicking this button.

 

You can walk your students through these steps in class, using a classroom computer to demonstrate. I recommend having students join on the spot in the classroom from their phones, tablets or laptops. Note that you can have them search for the course from the top toolbar or go into the Courses tab and use the right-hand search function with filters. 

 

 It helps here to give your course an intuitive name that includes the course number and semester!  

 

 

 

Invite your students to your course via e-mail!

This method, too, works only if you keep your course site and profile public. (Note that you can always change your privacy settings later, if you’d like). An easy way to have students join your course is to e-mail them the URL to your course profile. The link will take them to your profile page where, once again, they can simply click “Join Now.” 

A screenshot of an OpenLab course profile page, which includes a course avatar and a button that reads "Join Now." Students can join the course by clicking this button.

 

Invite your students to your course via the OpenLab!

You can invite your students to your course from your course profile page.  Click Membership in the right-hand menu, and then click Invite New Members on the following screen. If your course is on the smaller side, you can search individually for each of your students and invite them to your site in this way. Note that you can search for new members to invite either by typing in their e-mails or Display Names.

 

Screenshot of an OpenLab Site's Membership Setting Page. On this page, users can search form members to invite.

 

Your students will receive an automated confirmation e-mail.  Once the e-mail address is confirmed by the user, they will be added to your site.

I hope this helps explain how you can invite students to your course. Please visit our Help documentation on managing users on the OpenLab for a fuller overview. 

Part 5 of 5: Get to Know the OpenLab

Greetings,

This summer we have spent time introducing you to the OpenLab. You have explored the OpenLab, joined others’ sites, and begun creating a site of your own.

 This week, learn what opportunities exist to learn more about the OpenLab and get assistance when you have questions in the future.

 This concludes this 5-part series. Thank you for following along!

If you want to review this or previous week’s tasks, visit the archive on The Open Road.

Cheers,

The OpenLab Community Team

Part 4 of 5: Get to Know the OpenLab

Greetings,

This week, create on the OpenLab! In this case, ‘create’ can refer to creating sites, but also to creating communities, collaborations, and dialogue by joining other sites, connecting with friends, participating in discussion forums and more.

  • Task 1: Create Connections. 
    • Join our 3 in-house sites to stay connected and updated about what’s happening on the OpenLab:

      • The Open Road: Our one-stop-shop for all things OpenLab: news, workshops, events, community, and support!
      • The Buzz: Our student blogging team’s site; they post about life at City Tech and beyond!
      • Open Pedagogy on the OpenLab: A site for sharing and discussing resources about open digital pedagogy!

  • Connect with your friends and join other groups related to your interests:

      • You can search through people, courses, projects, clubs and portfolios using the menu at the top and the magnifying glass in the top-right
      • You can also search courses, projects, clubs and portfolios using the links titled by type of site (courses, projects, clubs, portfolios) under the slider. From the search page, use the filters (top-right) to tailor your search
      • more here.
  • Task 2: Create Sites of Your Own by referring to the section of our help content titled Sites on the OpenLab.

We’ll be in touch next week to help you answer: How can I get help and support with using the OpenLab?

Cheers,

The OpenLab Community Team

See the full 5-part series, on The Open Road.

Part 3 of 5 of: Get to Know the OpenLab

Greetings,

This week, join the OpenLab community by creating an account and setting up your profile. By becoming a member of the OpenLab community you’ll be able to create sites to support and share your scholarly and pedagogical work. Additionally, you can participate in the collaborative communities that use the OpenLab to support their work by joining their sites.

  • Task 1: Sign up for an OpenLab Account. To signup you’ll also need access to your City Tech email account. See the OpenLab’s help documentation on ‘ if you run into problems.

  • Task 2: Practice logging in to your account. Sign out of your account and close your browser. Then open a new browser window, navigate back to the OpenLab, and login to your account.

  • Task 3: Learn more about how to manage your account and profile, including updating your information, settings and avatar.
     

We’ll be in touch next week to help you answer: How can I use the OpenLab? Step 2, Create!

Cheers,

The OpenLab Community Team

See 5-Part Series online on The Open Road.

Part 2 of 5 of: Get to Know the OpenLab

Greetings,

This week, we continue our 5-part self-guided series and ask: How do others use the OpenLab? The tasks below will help you explore how members of the City Tech community use the OpenLab to support their learning, teaching, community-building, and other scholarly and pedagogical pursuits. 

  • Task 1: Check out In the Spotlight, our blog series that features a different site each week. You can review these blog entries by:
    • Scrolling through the blog – this will give you a reverse chronological view
    • Visiting the Spotlight Archive – this will give you a topical/categorical view
  • Task 2: Peruse the OpenLab’s new monthly blog series, Pedagogy Profiles, to learn more about how City Tech’s educators began and continue to use the platform to support their work.
  • Task 3: Read the Winter 2017 Nucleus Issue, which featured pieces from faculty about the creative ways they’ve used the OpenLab in the context of their courses and/or research. See our spotlight post on this issue for more!
  • Task 4: Explore the community using various search and filter options:
    • You can search through people, courses, projects, clubs and portfolios using the menu at the top and the magnifying glass in the top-right.
    • You can also search courses, projects, clubs and portfolios using the links titled by type of site (courses, projects, clubs, portfolios) under the slider. From the search page, use the filters (top-right) to tailor your search.

We’ll be in touch next week to help you join the OpenLab and figure out how you might use the platform.

Cheers,

The OpenLab Community Team

See 5-Part Series online on The Open Road.