{"id":4345,"date":"2022-09-14T13:50:06","date_gmt":"2022-09-14T13:50:06","guid":{"rendered":"https:\/\/www.petecodes.co.uk\/?p=4345"},"modified":"2022-09-15T14:47:28","modified_gmt":"2022-09-15T14:47:28","slug":"octoprint-for-the-seeed-studio-reterminal-live-blog-day-9","status":"publish","type":"post","link":"https:\/\/www.petecodes.co.uk\/octoprint-for-the-seeed-studio-reterminal-live-blog-day-9\/","title":{"rendered":"OctoPrint for the Seeed Studio reTerminal – Live Blog – Day 9"},"content":{"rendered":"\n
This post is a series of posts in which I detail my journey to bring OctoPrint to the Seeed Studio reTerminal.<\/p>\n\n\n\n
In today’s post we’ll be finishing off the Hello World Plugin, including adding some JavaScript, CSS and LESS to the Project as well as adding a new tab to the main OctoPrint UI<\/p>\n\n\n\n
After the quick side-quest yesterday setting up the basic OctoPrint installation on the reTerminal, I’m going to return to the HelloWorld Plugin Tutorial <\/a>today.<\/p>\n\n\n\n Today we’ll add a settings page for our plugin so we can set the URL using the GUI instead of the To add the UI for our settings, we need to create another template file in the config.yaml<\/code> file.<\/p>\n\n\n\n
Templates<\/code> folder in our Hello World Plugin project and add a template file in there called
hellowworld_settings.jinja2<\/code>, where we paste in the settings content we’d like to display;<\/p>\n\n\n\n
<form class="form-horizontal">\n <div class="control-group">\n <label class="control-label">{{ _('URL') }}<\/label>\n <div class="controls">\n <input type="text" class="input-block-level" data-bind="value: settings.plugins.helloworld.url">\n <\/div>\n <\/div>\n<\/form><\/code><\/pre><\/div>\n\n\n