Giter Club home page Giter Club logo

kirby-place-field's Introduction

Attention: As of August 8, 2016, I am no longer maintaining this plugin! Please use the new Map Field plugin, which will continue to recieve support, and is already more future-proof.

Place Field

I've found that adding location data to Kirby CMS forms to be super useful.

Unfortunately, this isn't one of the many fields available to us, out of the box.

Please note that the Place Field was recently updated to store data in YAML instead of JSON. The internals of this new storage method are still under development, so you may want to check out the original 0.1 release.

Features

  • Familiar Google Maps UI
  • Discrete storage of location name, latitude and longitude
  • Geocoding of place names and addresses
  • Repositionable marker (in case search doesn't nail it)
  • Support for multiple place fields per form
  • Support for place fields within structure fields.
  • Easy to implement (See "Getting Started", below)
  • Customizable default position and zoom— globally and on a per-field basis

Kirby Place Field Screenshot

Getting Started

If you like the command line, adding this to your project is super easy.

Be sure you have a fields folder in your site folder, then:

cd /path/to/your/project
git submodule add [email protected]:AugustMiller/kirby-place-field.git site/fields/place

It's important that the folder be named place, because kirby looks for the field class's definition in a PHP file with the same name as the folder.

You can also directly download an archive of the current project state, rename the folder to place, and add it to the site/fields folder of your project.

Once you've added the plugin, you can add a location field to your blueprints, like this:

fields:
  location:
    label: Location
    type: place
    center:
      lat: 45.5230622
      lng: -122.67648159999999
      zoom: 9
    help: >
      Move the pin wherever you'd like, or search for a location!

The center key allows you to customize the initial position and zoom level of the map interface.

You can also set global defaults, in your config.php:

c::set('place.defaults.lat', 45.5230622);
c::set('place.defaults.lng', -122.67648159999999);
c::set('place.defaults.zoom', 9);

These options will be overridden by any set on individual fields. Without either configured, it will default to hard-coded values.

Usage

The Place Field stores data in YAML.

You must manually transform the field to an associative array by calling the yaml field method.

The resulting array can be used just like any other:

$page->location()->yaml()['lat'];
// Or!
$location = $page->location()->yaml();
echo $location['lng']; # => -122.67648159999999

Properties address, lat and lng should exist in the decoded object, but may be empty.

Kirby creator Bastian Allgeier recently created the Geo Plugin, which is a great toolkit for working with coordinates. Check it out!

🌳

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.