[gelöst] Jekyll - Static Site Generator - Editor

Beitrag von **TRex** » 07.04.2022 17:23:56

Weil du die falsche index.html geöffnet hast. Nimm mal die auf toplevel.

Edit: ach nee, da ist auch keine. Keine Ahnung...

rodney · Beitrag von **rodney** » 07.04.2022 17:48:28

Wie schaut den der Quellcode von ./_site/index.html aus? Keonnte ja eventuell an href="<url>"-Attributen liegen

AxelMD · Beitrag von **AxelMD** » 07.04.2022 17:57:55

https://www.moncefbelyamani.com/how-to- ... in-jekyll/

Wie schaut den der Quellcode von ./_site/index.html aus? Keonnte ja eventuell an href="<url>"-Attributen liegen

Hinweis, das ist jetzt eine andere Seite.

./_site/index.htm

Code: Alles auswählen

<!DOCTYPE html>
<html lang="en"><head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1"><!-- Begin Jekyll SEO tag v2.8.0 -->
<title>Your awesome title | Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</title>
<meta name="generator" content="Jekyll v4.2.2" />
<meta property="og:title" content="Your awesome title" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<meta property="og:description" content="Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description." />
<link rel="canonical" href="http://localhost:4000/" />
<meta property="og:url" content="http://localhost:4000/" />
<meta property="og:site_name" content="Your awesome title" />
<meta property="og:type" content="website" />
<meta name="twitter:card" content="summary" />
<meta property="twitter:title" content="Your awesome title" />
<script type="application/ld+json">
{"@context":"https://schema.org","@type":"WebSite","description":"Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.","headline":"Your awesome title","name":"Your awesome title","url":"http://localhost:4000/"}</script>
<!-- End Jekyll SEO tag -->
<link rel="stylesheet" href="/assets/main.css"><link type="application/atom+xml" rel="alternate" href="http://localhost:4000/feed.xml" title="Your awesome title" /></head>
<body><header class="site-header" role="banner">

  <div class="wrapper"><a class="site-title" rel="author" href="/">Your awesome title</a><nav class="site-nav">
        <input type="checkbox" id="nav-trigger" class="nav-trigger" />
        <label for="nav-trigger">
          <span class="menu-icon">
            <svg viewBox="0 0 18 15" width="18px" height="15px">
              <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
            </svg>
          </span>
        </label>

        <div class="trigger"><a class="page-link" href="/about/">About</a></div>
      </nav></div>
</header>
<main class="page-content" aria-label="Content">
      <div class="wrapper">
        <div class="home">
<h2 class="post-list-heading">Posts</h2>
    <ul class="post-list"><li><span class="post-meta">Apr 7, 2022</span>
        <h3>
          <a class="post-link" href="/jekyll/update/2022/04/07/welcome-to-jekyll.html">
            Welcome to Jekyll!
          </a>
        </h3></li></ul>

    <p class="rss-subscribe">subscribe <a href="/feed.xml">via RSS</a></p></div>

      </div>
    </main><footer class="site-footer h-card">
  <data class="u-url" href="/"></data>

  <div class="wrapper">

    <h2 class="footer-heading">Your awesome title</h2>

    <div class="footer-col-wrapper">
      <div class="footer-col footer-col-1">
        <ul class="contact-list">
          <li class="p-name">Your awesome title</li><li><a class="u-email" href="mailto:your-email@example.com">your-email@example.com</a></li></ul>
      </div>

      <div class="footer-col footer-col-2"><ul class="social-media-list"><li><a href="https://github.com/jekyll"><svg class="svg-icon"><use xlink:href="/assets/minima-social-icons.svg#github"></use></svg> <span class="username">jekyll</span></a></li><li><a href="https://www.twitter.com/jekyllrb"><svg class="svg-icon"><use xlink:href="/assets/minima-social-icons.svg#twitter"></use></svg> <span class="username">jekyllrb</span></a></li></ul>
</div>

      <div class="footer-col footer-col-3">
        <p>Write an awesome description for your new site here. You can edit this line in _config.yml. It will appear in your document head meta (for Google search results) and in your feed.xml site description.</p>
      </div>
    </div>

  </div>

</footer>
</body>

</html>

Mit Visual_Studio_Code (Plugin HTML Preview) und mit jekyl_serve einwandfrei anzuzeigen.
Mit dem Firefox Browser nicht.

Was muss ich da ändern?

AxelMD · Beitrag von **AxelMD** » 07.04.2022 18:43:56

Diese Seite zu GitHub mit push

mit wget wieder geholt

Code: Alles auswählen

tree
.
├── about
│   └── index.html
├── assets
│   └── main.css
├── feed.xml
├── index.html
└── jekyll
    └── update
        └── 2022
            └── 04
                └── 07
                    └── welcome-to-jekyll.html

7 directories, 5 files

Und die index.html kann erfolgreich genutzt werden.

Wie erstelle ich mir mit Jekyll lokal die main.css?

Wie ich diesen wget-Ordner zu Jekyll konvertiere ist mir klar, das ist aber nicht mein Anliegen, es soll im ersten Anlauf richtig sein.

AxelMD · Beitrag von **AxelMD** » 07.04.2022 18:47:50

Code: Alles auswählen

tree
.
├── 404.html
├── about.markdown
├── _config.yml
├── Gemfile
├── Gemfile.lock
├── index.markdown
├── _posts
│   └── 2022-04-07-welcome-to-jekyll.markdown
└── _site
    ├── 404.html
    ├── about
    │   └── index.html
    ├── assets
    │   ├── main.css
    │   ├── main.css.map
    │   └── minima-social-icons.svg
    ├── feed.xml
    ├── index.html
    └── jekyll
        └── update
            └── 2022
                └── 04
                    └── 07
                        └── welcome-to-jekyll.html

Hier muss assets main.css irgendwie mit Jekyl eingebaut werden.

AxelMD · Beitrag von **AxelMD** » 07.04.2022 18:51:17

E.g.

In a folder which has an index.html file already (not a markdown fine)

Run

python3 -m http.server

Then open

http://localhost:8000/

Or in VS Code, uses the Live Server extension.

Die Lösung funktioniert auch, ist aber auch nicht die gewünschte Lösung.

AxelMD · Beitrag von **AxelMD** » 08.04.2022 08:33:27

AxelMD hat geschrieben:
05.04.2022 06:59:24
Hallo, wie kann ich mir local eine gebaute Website anschauen?
Code: Alles auswählen
jekyll build
Gehe ich dann in das Verzeichnis _site , bekomme ich zwar die html Seite angezeigt, jedoch nicht wie diese eigentlich aussieht.

Fehlt evtl. der Apache2 oder Niginx Webserver?

wget
Code: Alles auswählen
wget --mirror --convert-links --adjust-extension --page-requisites 
--no-parent http://example.org
Hole ich mir die Website mit wget ist eine Darstellung im Webbrowser ohne Abstriche möglich.

Wie erklärt sich das?

MfG
AxelMD

Nach den vielen erfolglosen Erklärungs- und Testversuchen die Frage zuvor nochmals.

AxelMD · Beitrag von **AxelMD** » 14.04.2022 11:52:14

Hallo, ist die Frage zu schwierig?

rodney · Beitrag von **rodney** » 14.04.2022 12:25:58

Das erklaert sich durch deine wget-Option --convert-links. Du kannst ja mal die beiden Dateien .../_site/index.html und .../mit/wget/geholt/index.html vergleichen.

Willst du die unterhalb .../_site/ generierte Seite im Browser anschauen dann benutze dazu den Befehl "jekyll serve" und oeffne in deinem Browser die URL: http://localhost:4000 (Ansonsten schau dir mal die _config.yml an)

AxelMD · Beitrag von **AxelMD** » 14.04.2022 15:08:25

--convert-links

Code: Alles auswählen

wget --mirror --convert-links --adjust-extension --page-requisites --no-parent http://example.org

Hallo rodney,

danke, nutzt Du Jekyll aktiv?

MfG
AxelMD

debianforum.de

[gelöst] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [] Jekyll - Static Site Generator - Editor

Re: [gelöst] Jekyll - Static Site Generator - Editor