Installation

HTML

Deutsch: Konfiguration/Installation:

-Mach eine Kopie der map-koeln-regierungsbezirk/config-sample.php und benenne Sie nach map-koeln-regierungsbezirk/config.php um. -bearbeite die neu erstellte map-koeln-regierungsbezirk/config.php – setzen Sie die korrekten Pfade und URLs zu Ihrer Website, – Sie können die Farben, Größe, etc. ändern. Links und Tooltips erstellen. -folgenden code an die Stelle Ihrer Webseite einfügen an der die Karte angezeigt werden soll

<?php require_once(‚PATH/TO/PLUGIN/generate_html.php‘); image_map_generate_html(‚PATH/TO/PLUGIN/map-koeln-regierungsbezirk/config.php‘); ?>

absoluten ServerPfad angeben:

<?php require_once(‚/www/htdocs/User/map/map/map-koeln-regierungsbezirk/generate_html.php‘); image_map_generate_html(‚/www/htdocs/User/map/map/map-koeln-regierungsbezirk/config.php‘); ?>

-Sie können zusätzliche config.php anlegen und bearbeiten in dem Sie config.php in z.B. config-kleine-map.php umbennen. – Wenn Sie diese Karte kombinieren mit anderen, müssen Sie die image-map und image-map.preset getrennt zu halten.

English: How to use:

– make a copy of the map-koeln-regierungsbezirk/config-sample.php (to config.php) – edit the new config.php: – set the correct pathes and urls to your website, – edit the areas, set links, disable areas, change texts, set colors, … – include this code at the place where you want to display the image map

<?php require_once(‚PATH/TO/PLUGIN/generate_html.php‘); image_map_generate_html(‚PATH/TO/PLUGIN/map-koeln-regierungsbezirk/config.php‘); ?>

specify absolute path:

<?php require_once(‚/www/htdocs/User/map/map/map-koeln-regierungsbezirk/generate_html.php‘); image_map_generate_html(‚/www/htdocs/User/map/map/map-koeln-regierungsbezirk/config.php‘); ?>

– you can create several configs and include the plugin multiple times on a site. – if you combine this map with others, you have to keep the image-map and image-map.preset files seperated

Back To Top

WordPress

Wordpress Mapplugin Installationsanleitung
WordPress Mapplugin Installationsanleitung

Wenn Einstellungen nicht sofort übernommen werden, leeren sie den Cache Ihres Browser etc!

Installation

Um ein WordPress Plugin installieren zu können haben Sie 2 Möglichkeiten:

  1. Zip-Datei entpacken und Ordner auf den FTP Webspace kopieren
  2. WordPress Installer benutzen.
  3. Aktivieren Sie das Plugin unter dem Menüpunkt Plugins in Ihrer WordPressinstallation im Backend.

chmod 777 wordpress installation
chmod 777 wordpress installation

 

Nach erfolgreicher Installation müssen die Ordner configs und js auf dem FTP Webspace mit CHMOD 777 versehen werden.

Im Ordner configs werden alle Konfiguration abgelegt die Sie erstellt haben.

Back To Top

Joomla 2.5 / 3.x

Installation Joomla Map Modul

Joomla 3 Map Modul installieren
Joomla 3 Map Modul installieren

Joomla 3 Map Modul installieren
Joomla 2.5 Map Modul installieren

Um dieses Map Modul zu installieren, muss eine funktionierende Version von Joomla bereits installiert sein. Stellen Sie sicher, Ihre installierte Joomla 3.0 Version oder höher ist. Sie müssen auch PHP 5.2.4 oder höher (empfohlen ist php 5.3+) und MySQL 5.0 haben, damit das Map Modul vollständig funktionieren kann.

 


Die Installation des Map Modul´s zwischen Joomla 3 und der
Joomla Version 2.5 unterscheiden sich NICHT und werden hier auch nicht weiter beschrieben.

Achtung: Wenn im Joomla Backend das Modulformular nicht geöffnet wird, fügen Sie folgende Zeile in Ihre .htaccess Datei auf Ihrem FTP-Webspace ein:

php_value max_input_vars 5000

Der Wert 5000 kann angepasst werden und dient hier nur als Beispiel

Wenn Einstellungen nicht sofort übernommen werden, leeren Sie den Cache Ihres Browser etc!

Installation

Um ein Joomla MapModul zu installieren, laden Sie es in den Installer im Backend Ihrer Joomlainstallation

Joomla Modul hochladen und Installieren
1. Joomla Modul hochladen und Installieren

Joomla Modul laden und aktivieren
2. Joomla Modul laden und aktivieren

aktivieren und positionieren
3. Joomla Modul aktivieren und positionieren

4.Joomla Modul Menu zuweisen
4.Joomla Modul Menu zuweisen

Back To Top

Contao

Contao Logo

Wenn Einstellungen nicht sofort übernommen werden, leeren sie den Cache Ihres Browser etc!

 

Installation

  1. Gehen sie auf den Contao Manager und melden sie sich an
  2. Gehen sie auf den Reiter „Pakete“ und klicken Sie auf den Button „Pakete hochladen“
  3. Wählen sie die Zip-Datei aus und folgen sie der Installation
  4. Aktualliesieren Sie die Tabellen der Datenbank

Contao Map Modul in Theme installieren

Das Contao Map Modul kann mehrmals auf der Seite in verschiedenen Konfigurationen eingebunden werden.

Dazu öffnen Sie die Themeansicht siehe folgende Grafiken

Contao Theme AuswahlContao Modul bearbeiten

Contao Modul bearbeiten Contao neues Modul erstellen

Contao Modul Auswahl

Contao Modul Auswahl

Map Modul in eine Seite einbinden

 

Contao Auswahl Seite
Contao Auswahl Seite

Contao neues Inhaltselement
Contao neues Inhaltselement

Contao Inhaltselement Modul Auswahl
Contao Inhaltselement Modul Auswahl

Contao Inhaltselement Karte Auswahl
Contao Inhaltselement Karte Auswahl

Wenn alles geklappt hat sollten Sie jetzt mit dem Konfigurieren des Map Moduls loslegen können.

Viel Spaß

Back To Top

Typo3

Manuelle Installation – Ordner kopieren auf FTP

Wenn der Inhalt Ihres Zipfiles einen Ordner mit dem Namen der Karte enthält kopieren Sie diesen in folgendes Verzeichnis Ihres Servers:

Via FTP: /var/www/typo3/htdocs/typo3conf/ext/

Danach muss noch das Plugin aktiviert werden. Dieses kann dann man im Reiter „Erweiterungen“ aktivieren.

Installation unter TYPO3 Version 10.4.x aus einer Zip Datei

Logo-Mapplugin-Typo3Grundlage dieser Anleitung ist eine funktionierende Installation von TYPO3, Version 10.4.x. Diese Dokumentation ist nicht gültig für ältere Versionen, da es mit Ihnen nicht mehr kompatibel ist.

Sollten Bearbeitungsschritte nicht sofort im Browser sichtbar werden, empfiehlt es sich als erste Maßnahme immer, sowohl den Browser-Cache, als auch den TYPO3-Cache zu leeren.

Installationsschritte

Die Map-Extension liegt als .t3x-Datei oder Zip-Datei lokal auf dem Computer vor.

Vergewissern Sie sich, dass Sie mit einem User mit Installationsrechten angemeldet sind, in der Regel der „admin“-User.

Wechseln Sie zum Extension-Manager (Adminwerkzeuge -> Erweiterungen).

Wählen sie mit Hilfe des nachfolgenden Dialogs die lokal gespeicherte .t3x-Datei oder Zip-Datei von ihrem Computer aus:

Und laden Sie diese hoch.

Das Plugin sollte automatisch aktiviert werden.

Typo3 Erweiterung installieren
Typo3 Erweiterung installieren

 

 

 

 

 

 

 

 

 

 

Plugin einfügen

Um das Plugin auf einer Seite einzufügen, wird unter „Web > Seite“ der Button für das Einfügen eines neuen Inhalts-Elementes gewählt (meistens „Inhalt“).

Typo3 Plugin in Seite hinzufügen
Typo3 Plugin in Seite hinzufügen

 

 

 

 

 

 

 

 

 

 

 

In der folgenden Ansicht in den „Plug-Ins“ Reiter wechseln, und das gewünschte Plugin auswählen.

Typo3 Erweiterung installieren
Typo3 Inhaltselement hinzufügen

Schließlich sollte man der Übersicht halber dem Inhaltselement einen Namen geben und es anschließend speichern. Soll die Überschrift des Inhaltselements nicht im Frontend erscheinen, kann sie über das Pull-Down-Menü „Typ“ auf verborgen gestellt werden.

Typo3 Inhaltselement Überschrift
Typo3 Inhaltselement Überschrift

 

 

 

 

 

 

 

 

 

 

Das Karten-Plugin ist nun erfolgreich installiert und wird im Frontend in seinen Default-Einstellungen bereits angezeigt.

Karte im Frontend
Karte im Frontend

 

 

 

 

 

 

 

 

 

 

 

 

Wenn alles funktioniert hat sollten nun die gewünschte Karten zu sehen sein: Hier das Beispiel der Weltkarte

Achtung: Wenn im Backend das Speichern nicht funktioniert, fügen Sie folgende Zeile in Ihre .htaccess Datei auf Ihrem FTP-Webspace ein:

php_value max_input_vars 5000

Der Wert 5000 kann angepasst werden und dient hier nur als Beispiel

Back To Top

Bearbeiten

Allgemeines zum Bearbeiten

Im Algemeinen werden alle Plugin´s und Module bei Image-maps.de gleich bearbeitet. Der einzige Unterschied liegt bei der Intsallation der jeweilen Content Managemant Systemen ( CMS )

Die CMS WordPress, Joomla, Contao, Typo3, Drupal werden in der Dokmentation zusammengefasst.

Das HTML Plugin wird seperat dokumentiert.

 

Back To Top

Konfiguration

Es können jeweils mehere Konfigurationen angelegt werden.

Unter Name, Titel, Config-Name etc. werden unterschiedliche Konfigurationen benannt.

Unter Width und Height wird der Maximalwert angegeben die die Karte haben darf.

Responsive: Karte responsive schalten an/aus

Liste mobile Geräte: manchmal ist es schwer die einzelnen Regionen auf dem Smartphone oder Tablet´s zu treffen. Hier kann auf eine Listenansicht geschaltet werden. Aktuell gilt dies nur für Regionen. Gesetze Marker werden in der Listenansicht zur Zeit nicht berücksichtigt

Back To Top

Standardfarben

Default Fill Color: Standard Kartenfarbe – Im Tab Region/Flächen kann diese Farbe für die jeweile Region/Fläche überschrieben werden
Default Stroke Color: Standard Randfarbe für Regionen
Hover Fill Color: Standard Farbe beim berühren mit der Maus – Im Tab Region/Flächen kann diese Farbe für die jeweile Region/Fläche überschrieben werden
Hover Stroke Color: Standard Radfarbe beim berühren mit der Maus für Regionen/Flächen
Disabled Fill Color: Farbe für deaktivierte Regionen
Disabled Stroke Color: Randfarbe für deaktivierte Regionen
deaktivierte Regionen werden im Tab Region/Flächen mit der Checkbox der jeweilen Region aktiviert/deaktiviert

Lines Fill Color: Standard-Flächen-Farbe für Linien
Lines Stroke Color: Standard Radfarbe für Linien

Standardfarben
Standardfarben

Back To Top

Standardfarben Text

Originalfarbe ‚#ffffff‘: zeigt die Standardfarbe Text – Grundeinstellung

Disabled Color: Textfarbe bei deaktivierte Flächen
Default Color: Regionen-Standard-Textfarbe
Hover Color: Regionen-Standard-Textfarbe beim berühren mit der Maus

Bei manchen Karten werden Bezeichnungen ausserhalb Regionen/Länder angezeigt. Diese werden dann zusätzlich ein einem eigenen Block hier gezeigt siehe Screenshot hier

Originalfarbe ‚#ffffff‘ und Originalfarbe ‚#808080‘:

TextStandardfarben

Back To Top

zusätzliche Texte

Der Tab zusätzliche Texte beinhaltet alle Texte die nicht mit einer Region verknüpft sind. Dies kann der Name der Karte sein oder zusätzliche Texte am Rand der Karte.

Label: Feld für Bezeichnungen
Font-Family: Schriftfamilie zB. Times New Roman, Arial, etc. ( Schriften müssen auf Server installiert oder extern verknüpft sein )
Schriftgröße: Schriftgröße ändern
Schrift verschieben horizontal: 0.5 rechts – 0.5 links
Schrift verschieben vertikal: 0.5 hoch – 0.5 runter

zusätzliche Texte

Back To Top

Fragen Antworten

Kann ich das HTML5 MapPlugin auch ohne PHP Nutzen?

Diese Frage wird uns des Öfteren gestellt.

Ja man kann! Zum eigentlichen anzeigen der Karte wird kein PHP benötigt.

Ich werde Ihnen an einem Beispiel zeigen wie Sie eine Karte erzeugen ohne dass später PHP auf Ihrem Server installiert ist.

Sie brachen lediglich ein PHP fähiges System um die Karte mit all ihren Einstellungen generieren zu können. Wenn es Änderungen an der Karte z.B. Farbe, Größe etc. geben sollte wird wieder das PHP fähige System benötigt.

So nun geht’s los

Die Installationsanleitung für das HTML5 Plugin befindet sich im download der Karte in der Datei Readme.txt. aber hier nocheinmal der kurze Text aus dieser Datei:

Konfiguration/Installation:

Bitte geben Sie dem Ordner etc die Schreibrechte CHMOD 777

installation-html5map

Öffen sie den Ordner mit dem Namen der Karte hier im Beispiel: map-landkreise-kreise-und-kreisfreie-staedte-in-deutschland-2011-09-04

-Sie können zusätzliche config.php anlegen und bearbeiten in dem Sie config.php in z.B. config-kleine-map.php umbennen.

– Wenn Sie diese Karte kombinieren mit anderen, müssen Sie die image-map und image-map.preset getrennt zu halten.

Öffnen Sie die Karte in Ihrem Browser und prüfen ob die generierte Karte Ihren Vorstellungen entspricht. Ändern Sie ggf. die Werte in der config-kleine-map.php.

Ist die Karte fertig konfiguriert kopieren Sie den Quellcode der Karte in einen Editor z.B. Notepad++ um die Pfade für die später ohne PHP genutzte Seite anzupassen.

Mein Beispielcode sieht nun so aus:

code fertige Karte ohne php

Fügen Sie den angepassten Code an die Stelle der Webseiten an der die Karte erscheinen soll.

Kopieren Sie den Ordner„etc“ auf den Webserver der ohne PHP arbeitet.

Das soll es dann gewesen sein.

Viel Spass

 

Back To Top