Original story (published on January 06, 2020) follows: If you’re enjoying learning about PixieBrix, please join our Community to share ideas, suggest features, and get support.New updates are being added at the bottom of this story……. If you’d like to try this yourself, you can build the Trello example in minutes by following this tutorial: Trello Status Sidebar (3 min). Sticking with the examples from the beginning of this post, the PixieBrix Sidebar could display the forecast for a specific location by detecting a zip code on the page and using it as a search parameter, or a currency converter could know which currency to convert to using a similar technique. When page context can be used as an input to a visualization, calculation, or search, it solves the navigation problem. To see an example, check out the video below that shows how PixieBrix can dynamically change the inputs to a Streamlit App based on web page context. …then the iframe shows the Trello Status Pageīut what if you want an iframe to show different content dynamically based on variables other than page URL, such as text or other data inside the web page itself? The Trello example is straightforward: If you’re working in Trello… Embed dynamic web apps, visualizations, and more! Now when you click the PixieBrix icon, it toggles the Sidebar. For this, I recommend pinning the PixieBrix extension to your Google Toolbar. The Sidebar is most helpful when you can easily toggle it in and out. ![]() See what I mean? It’s important to set where certain Sidebar content is available, which you can configure in the Availability tab. When working in GitHub, it shows the GitHub Status Page instead. When working in Trello, my Sidebar displays the Trello Status Page. Just drop in the URL of the page you want to display as well as the height and width dimensions, which should often be set to 100%. One nice thing about iframes - they don’t require much configuration. Here are three things to keep in mind when getting started: Getting started with Sidebars and IFrames is easy. For example, here’s the GitHub Status Page and the PixieBrix Status Page □ Getting started with Sidebars and iframes Many popular web applications have status pages, so this is generally helpful across the core tools we use. One way we at PixieBrix use the Sidebar with an iframe is to pull up the Trello Status Page when working in Trello: iframes can have their own scrollbar independent of the outer page’s navigationĪ simple example using iframes in Sidebars.iframes can be resized to fit different dimensions.iframes are particularly nice to work with for three reasons: ![]() Using iframes with PixieBrix is nice because it lets you display other websites, interactive web apps, data visualizations, and more inside panels. This is typically how websites embed ads or videos inside web pages. What is an iframe?Īn iframe, or inline frame, places another HTML document in a frame. ![]() Although you can configure the Sidebar to display many types of content, like fetching an API and displaying the results in a table or rendering notes in markdown, this post focuses on showing web content using an iframe. To help solve this problem, we introduced the ability to embed web content in the PixieBrix Sidebar Panel. This is especially true when navigation is required (e.g., searching the weather forecast for a specific zip code). ![]() Jumping over to another website once in a while isn’t bad, but doing so consistently can waste a lot of time. I was also just chatting with someone in hospitality who navigates over to when coordinating hotel reservations, and someone in banking who uses an online Currency Converter to spot check transactions for compliance. (as I write this post on 7/21, Trello is experiencing network issues) This post discusses how to embed web content in the PixieBrix Sidebar Panel using an iframe, including why this is helpful and specific use casesĭo you jump to specific websites or web tools for certain parts of your work? For example, sometimes I hit network errors with Trello, so I need to jump over to the Trello Status Page to check if there’s a service outage.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |