Plugins > Manage and Install Plugins...
qgis2web
Click Install plugin
or:
Plugins > Manage and Install Plugins... > Install from ZIP
Prepare your QGIS map with simple symbologies. You can improve your webmap like this:
Project > Properties... > General/Metadata
Layers Panel
Layer > Properties > Attributes Form > Fields > Alias
Run qgis2web from the Web menu, or via its icon in Web toolbar
The panes lets you set options to export your map. All options are written to your QGIS project, so save your project if you want to keep these settings.
When you first start qgis2web, you will see a preview of your webmap in the plugin's dialog box.
This preview does not update automatically when you change settings within the dialog. Click Update preview
to see your changes *
When you switch output format, by changing selection between OpenLayers
and Leaflet
, the preview does automatically update.
* You can disable the initial automatic preview on the Settings
tab
** The preview window will automatically be disabled if you have a layer with more than 1000 features
In QGIS, open Project > Project Properties... > General
. The following settings will affect your webmap:
Selection color
Background color
and open Metadata
. The following settings will affect your webmap:
Title
Abstract
Project title
and Project abstract
are visible in your exported webmap; they can be positioned upper left
, upper right
, bottom left
or bottom right
Selection color
is used as the highlight colour if Highlight on hover
is checked:
Give your layers human-friendly names in Layer properties > Source
Single quotes '
and quotation marks "
are supported but try not to use them
These will appear in your map's Layer list
, grouped or not :
Set your layers' scale-dependent visibility, if required:
Give your layer fields human friendly names via Layer > Properties > Attributes Form > Select Field > Alias
Single quotes ' and quotation marks " are not supported
Hide the field if you don't want to export it, by changing their Widget Type
to "Hidden". As a result, the information will not appear in the popup:
If you want to show images or video in popup you must set Widget Type
to "Attachment" and do not change other values. Only the Absolute path is supported:
Set the absolute path as the field text:
The result in your map will look like this
or this, for video
To attach documents and open them in another browser window, create a text field in your layer and write a string like this:
<a href="NTA_ENTE.pdf" target="_blank">NTA_ENTE.pdf</a>
Insert your document into exported folder
Popup will show the link as clickable and when clicked it will open a new browser tab showing Document (for supported format), or Download it
Data will not be drawn on the map. Useful if you want to show only labels.
More complex 2.5D styles are also possible, such as categorized:
Supported customization:
Supported customization for all svg's in simbology:
Change color's opacity, not layer's opacity
As of QGIS 3.0 and qgis2web 3.0 basemaps are now handled through the XYZ Tiles data source in QGIS.
http://tile.openstreetmap.org/{z}/{x}/{y}.png
OpenTopoMap
https://tile.opentopomap.org/{z}/{x}/{y}.png
Google Hybrid
https://mt1.google.com/vt/lyrs=y&x={x}&y={y}&z={z}
Google Satellite
https://mt1.google.com/vt/lyrs=s&x={x}&y={y}&z={z}
Google Road
https://mt1.google.com/vt/lyrs=m&x={x}&y={y}&z={z}
Bing Aerial
http://ecn.t3.tiles.virtualearth.net/tiles/a{q}.jpeg?g=1
XYZ Tiles can be accessed from menĂ¹ on top:
Then put in a name for basemap and the aforementioned URL
Then click to "add" to put in Map
The settings shown on this page can be set massively for all layers using the "Set all" input. The entries dedicated to the checks first insert them all, then remove them, then insert them etc...
When you launch qgis2web all activated layers in your qgis project will be checked as exportable. If you want to export all the layers of your project, turn them on before launching qgis2web or use the "Set all" input
Select whether the layer will be visible on map load. This only determines visibility - the layer will be loaded regardless of this setting:
Select whether a layer should show a popup and respond or whether the layer should not listen to click events.
OpenLayers popup will show all features information present in a click point, showing layer's name relating to queried feature
Leaflet popup will only show information for one feature at a time
Specify how each field will be labeled in pop-ups
no label | inline label | header label |
The options will have the following result in the popup:
no label
(displays only data in the popup without showing the field name)inline label - always visible
(displays field name on the same line as data)inline label - visible with data
(displays field name on the same line as data, only if data is present)hidden
(keeps information in the popup hidden at all times)header label - always visible
(displays field name above data)header label - visible with data
(displays field name above data, only if data is present)If unchecked, WFS layers will remain remote WFS layers in the webmap. If checked, the layer will be written to a local GeoJSON file
Cluster point features:
If checked, the wms layers will be queryable with popup
Add a info window in the webmap which shows the projects title
Add a collapsible info window in the webmap which shows the projects metadata abstract
Include list of layers (with legend icons, where possible)
Only for Leaflet export: Allows you to choose multiple fields and will show the graphical possibility of filtering the data visible on the map
Show user's location on map
Note: Chrome now blocks geolocation unless your map is hosted securely (HTTPS)
Include interactive measuring widget - choose metric or imperial units
Add field to allow searching for address locations (geocode)
Add option to search for values in layer field values
Note: Layer search does not work in leaflet export if a point layer with symbols other than circle is used Note: Layer search does not work in openlayers export if cluster is active in that layerShow popups when mouse hovers over features
Highlight features on mouseover
Create webmap in same projection as QGIS project, otherwise the webmap is projected in EPSG:3857
Select HTML template for webmap - add your own templates to /qgis2web/templates directory in your current QGIS3 profile folder
Choose controls main color
Choose controls background color
Either match the current QGIS view or show all contents of all layers (only local GeoJSON and rasters, not WFS/WMS)
How far the webmap will zoom in
How far the webmap will zoom out
Prevent panning or zooming beyond the selected extent
The folder where the webmap will be saved
How your map will be exported - currently supported are `Export to folder` and `Export to FTP site`: Click the `...` button to configure the export settings
Remove unnecessary whitespace from exported GeoJSON to reduce file size
Simplify geometry to reduce file size. Note that 1 is the most aggressive simplification and 15 the least, for polygons a setting of 4 is probably about the right compromise between data size and quality
QGIS, OpenLayers, and Leaflet are all different mapping technologies. This means that their respective functionality differs in many ways. qgis2web does its best to interpret a QGIS project and to export HTML, Javascript, and CSS to create a web map as close to the QGIS project as possible.
However, many elements of a QGIS project cannot be reproduced, and many are only possible in either OpenLayers or Leaflet. qgis2web tries its best to produce a publish-ready map, but you can always manually edit the output code to achieve what qgis2web cannot.
The limitations are described in the body text of this WIKIPlease report any problems you have with qgis2web. Without this feedback, I am often completely unaware that a problem exists. To ensure no time or effort is wasted in bug reporting, please follow these steps:
github.com/qgis2web/qgis2web/issues
, including:
The stability of qgis2web relies on your bug reports, so please keep them coming.