<div class="xblock xblock-public_view xblock-public_view-vertical" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="VerticalStudentView" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="vertical" data-usage-id="block-v1:demo-content1+basicdemo+01+type@vertical+block@6b04c1f2809f4b7db2c470f659575e9c" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<div class="vert-mod">
<div class="vert vert-0" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@26f16d03935c46ba9142a02381ca36b6">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@26f16d03935c46ba9142a02381ca36b6" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<p><img height="100%" width="100%" src="//d24jp206mxeyfm.cloudfront.net/assets/courseware/v1/68ea0160b6ea134ccdb14b6735ce00cf/asset-v1:demo-content1+basicdemo+01+type@asset+block/Section_1_Content_Resources.png" alt="Welcome to Section 1 image" /></p>
</div>
</div>
</div>
<script type="text/javascript">
(function (require) {
require(['https://d24jp206mxeyfm.cloudfront.net/static/js/dateutil_factory.a28baef97506.js?raw'], function () {
require(['js/dateutil_factory'], function (DateUtilFactory) {
DateUtilFactory.transform('.localized-datetime');
});
});
}).call(this, require || RequireJS.require);
</script>
<script>
function emit_event(message) {
parent.postMessage(message, '*');
}
</script>
</div>
<div class="xblock xblock-public_view xblock-public_view-vertical" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="VerticalStudentView" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="vertical" data-usage-id="block-v1:demo-content1+basicdemo+01+type@vertical+block@7bb011117d05400db1b0aeb3ce8866b0" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<div class="vert-mod">
<div class="vert vert-0" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@968999813bb44dc4a57bc58a671146c0">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@968999813bb44dc4a57bc58a671146c0" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<div style="border: 3px solid #F02770; box-shadow: 5px 10px #fffff; border-radius: 25px; padding: 2rem; background-color: #e9ebea;">
<h3>About Announcements</h3>
<p>An announcement is a particular component we are using to say hi. It can be used to add any relevant information for your students to navigate through the course or share any news with them.</p>
</div>
<p></p>
</div>
</div>
<div class="vert vert-1" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@b38941fd50f64b059f99e6868590092d">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@b38941fd50f64b059f99e6868590092d" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<p></p>
<h3 class="hd hd-2">December, 2023</h3>
<section class="update-description">
<section class="primary">
<p>This course aims to show you all the fantastic content components that Open edX has and give you an idea of what you can do with it for your future courses so that you will find an example of all the components on the platform in their primary form of use. </p>
</section>
<h4 class="hd hd-4">Astronomy examples</h4>
<p>As a common topic, you will find that we will talk about astronomy in this course. We want to give you a more realistic view of how the platform content tools work on an actual course. Still, this is not a course about astronomy, but if you learn anything along the way, that is a plus.</p>
</section>
</div>
</div>
</div>
<script type="text/javascript">
(function (require) {
require(['https://d24jp206mxeyfm.cloudfront.net/static/js/dateutil_factory.a28baef97506.js?raw'], function () {
require(['js/dateutil_factory'], function (DateUtilFactory) {
DateUtilFactory.transform('.localized-datetime');
});
});
}).call(this, require || RequireJS.require);
</script>
<script>
function emit_event(message) {
parent.postMessage(message, '*');
}
</script>
</div>
<div class="xblock xblock-public_view xblock-public_view-vertical" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="VerticalStudentView" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="vertical" data-usage-id="block-v1:demo-content1+basicdemo+01+type@vertical+block@313bd16991a647aa9e21a8584321c0ee" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<div class="vert-mod">
<div class="vert vert-0" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@e954212d076848b0bdad7d810992aa81">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@e954212d076848b0bdad7d810992aa81" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<div style="border: 3px solid #F02770; box-shadow: 5px 10px #fffff; border-radius: 25px; padding: 2rem; background-color: #e9ebea;">
<h3>About Texts</h3>
<p>The text component is the most commonly used in a course because it allows you to add and edit text as any regular text editor and adds code content, links, and images, among other functions. For example:</p>
</div>
<p></p>
<p></p>
<h2>What Is Astronomy?</h2>
<p>As a basic definition, astronomy is the study of space and the elements in it. But this definition can be much larger and more complicated when we fall back on the amount of other sciences necessary when studying space and all that we have to learn about this subject.</p>
</div>
</div>
</div>
<script type="text/javascript">
(function (require) {
require(['https://d24jp206mxeyfm.cloudfront.net/static/js/dateutil_factory.a28baef97506.js?raw'], function () {
require(['js/dateutil_factory'], function (DateUtilFactory) {
DateUtilFactory.transform('.localized-datetime');
});
});
}).call(this, require || RequireJS.require);
</script>
<script>
function emit_event(message) {
parent.postMessage(message, '*');
}
</script>
</div>
<div class="xblock xblock-public_view xblock-public_view-vertical" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="VerticalStudentView" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="vertical" data-usage-id="block-v1:demo-content1+basicdemo+01+type@vertical+block@7285dae04971426f983b2435f692f8c9" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<div class="vert-mod">
<div class="vert vert-0" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@c6d17fb89b3941abbaa7c2daa33bc654">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@c6d17fb89b3941abbaa7c2daa33bc654" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<div style="border: 3px solid #F02770; box-shadow: 5px 10px #fffff; border-radius: 25px; padding: 2rem; background-color: #e9ebea;">
<h3>About Raw HTML</h3>
<p>This component is similar to the simple text but opens in the Raw HTML editor rather than the Visual
editor. It will allow you to enter HTML text to edit content like the title and text and even embed content like the animation of the orbits that you can find below this text.</p>
</div>
<p></p>
<p>The following animation shows an example of the orbits of different celestial bodies and how their interaction configures their movements.</p>
<p>In celestial mechanics, an orbit is an object's curved trajectory, such as a planet's trajectory around a star, a natural satellite around a planet, or an artificial satellite around an object or position in space, such as a planet, moon, or asteroid. Commonly, orbit refers to a regularly repeating trajectory, although it may also refer to a non-repeating trajectory. To a close approximation, planets and satellites follow elliptic orbits, with the center of mass being orbited at a focal point of the ellipse, as described by Kepler's laws of planetary motion.</p>
</div>
</div>
<div class="vert vert-1" data-id="block-v1:demo-content1+basicdemo+01+type@html+block@a4865d36136744f090a5990264c92754">
<div class="xblock xblock-public_view xblock-public_view-html xmodule_display xmodule_HtmlBlock" data-course-id="course-v1:demo-content1+basicdemo+01" data-init="XBlockToXModuleShim" data-runtime-class="LmsRuntime" data-runtime-version="1" data-block-type="html" data-usage-id="block-v1:demo-content1+basicdemo+01+type@html+block@a4865d36136744f090a5990264c92754" data-request-token="de57ae4cb02311efab97aab0e56e299a" data-graded="False" data-has-score="False">
<script type="json/xblock-args" class="xblock-json-init-args">
{"xmodule-type": "HTMLModule"}
</script>
<p class="codepen" data-height="600" data-default-tab="result" data-slug-hash="nobaQK" data-user="willpaige" style="height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<span>See the Pen <a href="https://codepen.io/willpaige/pen/nobaQK">
Orbital Css</a> by Will Paige (<a href="https://codepen.io/willpaige">@willpaige</a>)
on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>
</div>
</div>
</div>
<script type="text/javascript">
(function (require) {
require(['https://d24jp206mxeyfm.cloudfront.net/static/js/dateutil_factory.a28baef97506.js?raw'], function () {
require(['js/dateutil_factory'], function (DateUtilFactory) {
DateUtilFactory.transform('.localized-datetime');
});
});
}).call(this, require || RequireJS.require);
</script>
<script>
function emit_event(message) {
parent.postMessage(message, '*');
}
</script>
</div>
© All Rights Reserved