Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix issue #254. Make Galleria run out of the box. #255

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 6 additions & 4 deletions docs/getting_started/beginners_guide.rst
Original file line number Diff line number Diff line change
Expand Up @@ -107,12 +107,14 @@ but the simplest one is probably to just add images as HTML.

Add the following markup inside the ``<body>`` tag::

<div id="galleria">
<div class="galleria" style="height: 300px">
<img src="photo1.jpg">
<img src="photo2.jpg">
<img src="photo3.jpg">
</div>

Note that we set a height for the ``<div>``. This is necessary for Galleria to work properly,
and you can set it via CSS rules if you'd like. If a Galleria

Load a theme
============
Expand All @@ -132,7 +134,7 @@ Activate the gallery
All we need to do now is to activate Galleria.
Add the following script after the loadTheme function we just inserted::

Galleria.run('#galleria');
Galleria.run('.galleria');
</script>

As you can see, we just applied galleria to the '#gallery' container where the images are. That’s it!
Expand All @@ -151,14 +153,14 @@ The complete code example:
<script src="galleria/galleria-1.2.7.min.js"></script>
</head>
<body>
<div id="galleria">
<div class="galleria" style="height: 300px">
<img src="photo1.jpg">
<img src="photo2.jpg">
<img src="photo3.jpg">
</div>
<script>
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
Galleria.run('#galleria');
Galleria.run('.galleria');
</script>
</body>
</html>
Expand Down