How to display a booklet map in one post in jekyll?

I am trying to insert a card in one post in Jekyll.

Here is the visible effort of my attempt: github link

Here is the link to the github account itself: link

I took the default template, i.e. Hyde.

Then I added sheets of CSS and JS files to _includes / head.html

Then I created a message based on _layouts / default.html (draws from head.html by default)

As I said, I'm trying to insert one card in one post. If you look at the first link, it shows a map of the entire blog in a strange way.

It does not appear in a separate entry.

How can I do this job?

I hope that in the end you will have a series of messages, each of which has its own map, if possible.

Here is the single mail code that I still have:

--- layout: default title: Trying to integrate map in jekyll --- <div id="map"> </div> <script> var map = L.map('map').setView([34.00000, -118.260126], 14); mapLink = '<a href="http://openstreetmap.org">OpenStreetMap</a>'; L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: 'Map data &copy; ' + mapLink, maxZoom: 18, }).addTo(map); var marker = L.marker([34.063298, -118.260126]) .addTo(map).bindPopup("<b>Blah Blah Blah</b><br /><a href='http://www.cnn.com'>Additional Information</a><br />").openPopup(); </script> 

I understand that this post relies a lot on links, and it frowned here at SO. But I have no other way to explain my problem.

+1
source share
1 answer

The correct code in _includes/head.html :

 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css"> 

not

 <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.3/leaflet.css"></script> 

and

 <style type="text/css"> #map { width:400px; height:550px; background-color: red; } </style> 

not

 <style type="text/css"> #map { width:400px%; height:550px; background-color: red; } </style> 
+3
source

All Articles