Hi, we’re using handed coded static HTML with the Embedded module. We like to know:
IS there a path to use for images and fonts that we have uploaded into the library?
IF no, can we create a folder to place the images and fonts we will use in the HTML?
Will the images and fonts be downloaded to the media player and not be called back to the server every time the layout is displayed?
We did see this post for datasets asking the same thing.
Thanks
Can you confirm if you are using a Docker or custom setup and the OS it is installed on?
The Path to your Library will depend on the Location you have configured with your CMS. Confirming how your CMS is set up will help to narrow down where that location is.
This question relates to the first and so the answer is the same.
When using an Embedded Widget in Xibo, the Player will not download the content to display locally, it will instead display the Embedded link until the Layout/Region duration has come to an end and then access the embedded content again on the next loop/scheduled time.
The post you have included a link to is using a Dataset instead of a HTML page. They have created a CSV File containing links to their online and local content. This is a very different setup to the HTML you have created, which you are displaying using an Embedded Widget.
Many Thanks.
If you’re using the EmbeddedHTML widget, then you can’t reference library files directly, since the Player won’t know to download those and so they won’t be available on the Player.
You can force the Player to download those by using “Assign File” from the Display Page. That will cause the images you upload to be downloaded to the Player (but not shown). They’ll then be in the Player library with their media ID as their name (eg 27.jpg) in the same location as your HTML will be run from.
It is possible to do that, but not recommended. Note that media IDs change each time that file is updated.
Thanks Dan and Alex,
To answer Dan’s question: We have the most recent version of Xibo and installed using Docker.
So based on your reply Alex, how do we take advantage of the “embedded” module for images and fonts with HTML while NOT having to call out to a URL? Images are fonts are very important to a static design created with HTML and CSS.
If we were to force the Player to download those files by using “Assign File” from the Display Page, then how do we include the path to the file within the HTML so that it displays correctly?
We want to take advantage of the Player caching these files (images and fonts). If the HTML code within the embedded module calls out to a path on the web for a font or image, does the Player cache the file?
We understand the file IDs will change each time that file is update. However, can you explain what “exactly” do you mean by “update”? We don’t plan the change the image once it’s uploaded into the media library. What elements that could change be considered as an update?
We appreciate your help.
Jon
There’s no path. The image would be in the same location as the html. So just include it as you would for a portable website (eg <img src=“29.jpg”>) . Keep in mind that won’t work in the Preview but it will work on the Player.
No it won’t cache anything included directly from the web beyond basic web browser caching. It won’t download and serve it from local storage automatically.
The ID will change each time you upload a new version of the file. Changing name etc won’t trigger a new ID.
Fonts may just work if you upload them in to the CMS and then reference them by name in your HTML.
Fundamentally you’re forcing the Player to do something it’s not designed to do, so this isn’t pretty.
We have plans to include a widget type which takes a zip full of resources and an html file which the Player would extract in to a local folder and then render the HTML. That won’t be available in 1.8 however, but it is on the roadmap.
Hi Alex,
Thanks for your reply. Bummer the player doesn’t work nicely with HTML and media library images and font sources for the embedded module. Seems only NATURAL to connect the two? May we ask WHY this is so complicated?
Regarding HTML zip extraction, we’ve seen that same feature of the on other systems. Sort of nice, but wouldn’t it be better to connect the dots of using images and fonts in the media library WITH the embedded HTML module instead? The HTML extract is a stand alone feature, might as well use a jpeg image where the images and fonts would be a great enhancement with the application itself. Would anyone agree?
Thanks again, we really appreciate all you guys are doing and the forum is such a resource!
Why? Because you’re trying to do something it’s not designed to do. In the same way that making it do anything else it isn’t meant to do, you’re going to find it more difficult.
Assign file wasn’t designed to do that job. It’s there to support player upgrades, not to allow people to do what you’re trying to do.
I agree it would be nice to have something more flexible, but it’s NOT designed to do that at present, so it shouldn’t be surprising its not polished!
I could just say it’s not possible to do what you want at all - that would have been much quicker for me. I took the time to explain a potential workaround since it is technically possible, if not ideal.
Why not use a dataset based ticker instead? That will allow you to include images and fonts directly from the library, and will allow custom HTML - with some limitations.
Hi Alex,
First let us say, thank you for your time. You’re right, you could have replied with a brief answer and been done. We appreciate your consideration. Our "question why" was not meant to sound sarcastic, rather inquisitive. The data sets can reference images and fonts we just wondered why can’t the embedded module do the same? As UI/UX designers, this would appear somewhat the same in our minds. Of course, in the programming world, that’s not simply the case?
To answer your question about "Why not use a dataset based ticker instead?" If we had to sum it up in one word, aesthetics. We want to create layouts that are nicely designed so the everyday end user; the store manager, a small restaurant owner, etc,. who wants premium design and only wants change the DATA of the layout - make simple data updates.
Back to data sets, I’m wondering if we are misunderstanding just what we can do with our CSS/HTML for the output on data sets? We thought we could only format "an HTML table?" It has to be an HTML table, is this correct? If so, that’s great works for so many situations, however, not so much for advance design layouts. For example, this menuboard we attached, if the embedded HTML could pull from the media library in a way the data set can pull from the library we could easily write the HTML/CSS for this menu.
Again, Xibo application is a strong application within the digital signage industry. We don’t expect it to be a design tool either, or fully polished, we are only trying to figure how to take and ASSEMBLE our designs within the Xibo system where the data can easily be updated.
Please let us know about the HTML Table and data sets. We’re sold on your application : )
What you want to do is exactly what datasets are for!
Yes you’re correct that with a dataset view, you get tabular output, but if you use a ticker instead, then you’re working with divs and you can style them however you wish.
The user then can just update the dataset and the changes appear in they layouts that use that.
The reason why is that the embedded module is designed to show some basic HTML that you might want to embed - an external widget for example.
There’s no reason why it couldn’t be developed to allow you to reference images etc in a nicer way, but that was not it’s intended use and so it doesn’t offer those features currently.
If however we were to allow that, your user would have to be editing raw HTML to make changes as the menu wouldn’t be driven from a dataset.
It would be far easier to have them edit text fields in a layout or even make a custom module than have them edit HTML.
Hi Alex,
Thanks for your reply. So we did understand the Data Sets and the output is for tabular display only. We’ll look into the ticker, that’s something we didn’t consider. Thank you!
As for the the end user edit text fields in a layout, you are READING OUR MINDS! (lol) Just to have the media library working with Embedded module would be great.
Althought, we’ve worked with a developer who suggested using Data Tables Library Editor for for the end user’s input. The amount of options in this jQuery library is perfect. We think it would be great not only to use text input fields, but simple drop down menus, radio buttons, check boxes, the typical web form elements for data input.
I will say, we’ve had IT folks discussing with us how they use Xibo for their digital signage installation. They mentioned IF if there was a module exactly as you and I have been discussing here in this thread, the IT folks could easily hire front-end web designers to create their client’s content. All while, allowing their clients themselves to update the data content easily and as often as needed. Gives the IT people more of a reason to use Xibo that’s for sure : )
Thanks for your feedback - if you are interested, we’ve create a simple slide show on this concept module would flow within Xibo. We can share with you for future development. Just let us know : )
Thanks again!
Jon
I think you’re slightly missing my point here.
Datasets ARE that solution. They are a general purpose datastore which you can reference in your layouts, either in a tabular fashion, or otherwise.
Your conclusion that datasets == tables is very wrong. Dataset Views are exactly that, but that’s a tiny part of what you can do with them.
We’ve already got extensive work underway on the layout designer as documented on the blog post on the subject. We’re not looking to make further changes just now beyond that.
We have done commercial work with customers to produce menu boards exactly as you’ve shown, and they are all driven by datasets. That’s our view of how that kind of thing should work.
If I was able to share some examples with you I would, but unfortunately contractual obligations prohibit that. They do however look very similar to what you’ve shown, and allow the user to just update pricing and images directly in the dataset. The layouts then all update accordingly.
We’ll look more into the datasets, when we realized the output was tabular formatting only we didn’t see it as a solution. With the Ticker, perhaps it could work. There’s only 2 ways to extract data is the Ticker Module and the Dataset module itself. Is that correct?
We understand you can’t share the visual examples, however, did the the client you mentioned have to use the Ticker Module for outputting their dataset content or code a custom module for their dataset output?
Please keep in mind, our interests are not just for menuboards, that’s only one form of design work we provide. The ticker may just work for another form of design we do, promotional sales for clients in-house marketing. Although, even though it’s only typography there’s design involved with the CSS styles. The attached is a few type of digital-posters for various promotional sales marketing campaigns, bars and grills. Within these examples, only the text will be updated. The Region underneath is a video playing.
Please let us know if they had you you mentioned. This might be what we are seeking. You got us thinking about the Ticker/Datasets.
Thanks again Alex - your help is GREATLY appreciated!
If we were doing it we’d develop a custom module in most cases, but ticker would get you 90% of the same functionality.
Of course you can add or remove items! Keep in mind though that formatting 20 items vs 3 on a screen is a very different proposition so you will have to impose some limits to keep things looking good.
The three poster example you show though is absolutely prime for a dataset ticker. You just place the ticker where you want the text to appear, format the merge fields, and limit the ticker to show only the appropriate item on the appropriate row of the dataset.
We think you’re right about the ticker and the digital-posters being about 90% there. We’ll update to the post our results to help others that may have a similar design project.
Do let us know if the commercial work you mention, did the client use the Ticker Module to output the content or if you created something custom for them to format the typography design? The dataset input has not been the question, it’s HOW do we get the content out of the database with handcrafted design?
Again, your help with this support forum is awesome! How else would we learn the options of design assembly with Xibo?
Jon
I think I mentioned it in my last reply, but if we’re doing a menu board then we’d use a custom module for ease, but ticker gets you a long way towards the same result.
I had a chat with Dan this morning.
You can link library images in to the embedded HTML widget.
In your embedded code, you’d do something like
<img src="[32]">
That would embed media id 32 in to that location. The CMS will manage the file association for you.
Hi Alex,
Sorry for the long delay in my response. I wanted to say thank you for following up. You guys really do have GREAT support on this forum!