Skip to content

Instantly share code, notes, and snippets.

@geoffyuen
Last active April 6, 2020 14:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save geoffyuen/eddc958c12fbd78299685d05b5abc18b to your computer and use it in GitHub Desktop.
Save geoffyuen/eddc958c12fbd78299685d05b5abc18b to your computer and use it in GitHub Desktop.
Craft for Wordpress theme developers

Craft for Wordpress theme developers

https://craftcms.com/guides/developers-new-to-craft

Know: Twig (templating) and Yii (php framework).

Install Craft in Local by Flywheel

Overview: Setup Local environment, install Composer and then use Composer to install Craft. You can also download and install manually but Craft also uses Composer to install plugins so you may as well try this method.

  1. Create site in Local
  2. Take note of the Remote port displayed in Local > Your site > Database. Also the DB creds will be user: root, pass: root, name: local as with all Local installs
  3. Right-click your Local site open site ssh
cd /app
rm -r public
apt-get update && apt-get install -y curl unzip
curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer
composer create-project craftcms/craft /app
/app/craft setup

The database should look something like this:

root@6b52ccf77eb7:/app/craft# ./craft setup
Which database driver are you using? [mysql,pgsql,?]: mysql
Database server name or IP address: [127.0.0.1]
Database port: [3306] 4022
Database username: [root]
Database password:
Database name: local
Database table prefix: craft_
Testing database credentials ... failed: SQLSTATE[HY000] [2002] Connection refused
Database server name or IP address: [127.0.0.1] localhost
Database port: [4022]
Database username: [root]
Database password:
Database name: [local]
Database table prefix (type "none" for none): [craft_]
Testing database credentials ... success!
Saving database credentials to your .env file ... done

Install Craft now? (yes|no) [yes]:yes
  1. I recommend you name your public folder the same as it is in your production environment, then configure Local to be the same. Example, public_html:
  2. Rename web to public_html: mv /app/web /app/public_html (you can now exit termnal/ssh)
  3. Edit /app/conf/apache/000-default.conf or /etc/apache2/sites-enabled/000-default.conf
  4. Replace all (two) instances of /app/public with /app/public_html
  5. Right-click your Local site and restart the site

Now you can view the site, and access the admin from {{ site_url }}/admin.

Install Craft in Lando

https://www.eaglepeakweb.com/blog/install-craft-cms-3-lando-docker

This was the only way I could get it running on my Macbook Pro 2011. Local and other Docker solutions did not work.

  1. Delete your installation of Docker 🤷‍♂️|
  2. brew cask install lando
  3. Run Docker - wait until the Whale menubar icon stops animating
  4. Make a folder and lando init
  5. Edit the .lando.yml:
name: craft3blog
recipe: lamp
config:
  webroot: web
  php: '7.2'
  database: mariadb:10.2
  1. lando start
  2. lando composer create-project craftcms/craft temp
  3. mv temp/* . - move files
  4. mv boop/.* . - move dot files
  5. rm -rf boop
  6. enter db creds in .env using info from lando info
  7. edit .lando.yml
name: craft3blog
recipe: lamp
config:
  webroot: web
  php: '7.2'
  database: mariadb:10.2
services:
  database:
    type: mariadb:10.2
    portforward: 3311
    creds:
      user: homestead
      password: secret
      database: craft3blog
  1. lando destroy
  2. lando start
  3. install by visting http://{{ yoursite }}/admin/install

Install Craft in Cloudways

https://www.cloudways.com/blog/install-craft-cms-on-cloud/

Preview links not working inside the admin?

Edit config/general.php and add siteUrls to each of the environments. Eg. 'dev => [ 'devMode' => true, 'siteUrl' => 'https://mylocal.dev' ]'

Craft and GIT

https://nystudio107.com/blog/setting-up-a-craft-cms-3-project#deploying-craft-cms

https://craftcms.com/guides/craft-storage-gitignore

Move to new server

https://craftcms.com/guides/duplicating-a-craft-site https://craftcms.stackexchange.com/questions/13982/migration-of-craft-cms-from-one-host-to-another

Gotchas

  • ./web is the public_html folder - it doesn't need to be named web, just be set to public and viewable
  • needs Composer to install/update plugins
  • Craft doesn't use defined templates (eg. archive.php, single.php, search.php) - these are defined by you by creating sections and their corresponing twig templates
  • no menus system - you should create your own menu system by using Sections and Fields (Structures are good because you can arrange them in a tree hierachy)

Archives and pagination

https://craftcms.com/guides/creating-an-archive-page-for-entries

Search

https://docs.craftcms.com/v3/dev/examples/search-form.html

Structures and urls

By default Structures are set to use site_url/{slug}. To make them nested set the slug of the Structure to {entry.last().uri}/{parent.uri}/{slug}

Reserved Field Names

  • title
  • link
  • type

WordPress analogues

Wordpress Craft
posts entries
{{ post.field }} {{ entry.field }}
custom post types sections
/wp-content/plugins /vendor - devs say that this should be in your .gitignore 🤷‍♂️
acf-json project.yaml - will save your fields, sections, more...
  • Sections can be
    • Singles - single use, unique 'posts'. eg. Home, Contact
    • Channels - streams of similar 'posts'. eg. Blog
    • Structures - nested/tree 'posts' eg, I use this for Pages

Versus WordPress

  • twig is used in Craft from the ground up
  • no php - if you need php you can write a plugin or module
  • more configuration is needed over WP which more better out of the box
    • setting Sections is done in the admin - not great for delevelopment in teams (means you have to share databases)
  • no Menu management or functions - you can use Structures or plugins
  • there is no Rich Text or WYSIWYG field - use Redactor plugin
  • Commerce is $199 for simple transactions (donations), $999 for full store functionality (cart)
  • inserting a link is different from linking to an internal page (entries)

Versus ACF PRO

  • is free
  • no field layouts (width, tabs)
  • there is no repeater field - use Super Table plugin
  • the Matrix field is like Flexible Content but you cannot nest - use the Neo plugin ($) to nest fields
  • Super Table can contain a Matrix field: Matrix > Super Table > Matrix
  • a url field has no facility to link to pages on a site you have to let the user choose between a raw url or a page relationship - use Typed Link Field

Versus Timber

  • much more strict
  • instead of {% if items %} use {% if items is defined %}
  • instead of {% for item in post.blocks %} use {% set items = entry.blocks %} then {% for item in items.all() %}

Recommended Plugins

  • Redactor: wysiwyg field
  • Super Table: adds a repeater field of fields or
  • Neo ($/yr): nested matrix fields, reuse fields
  • Typed Link Field: allows users to create links to any Craft entries, assets etc or urls, emails, telephone links
  • Wheelform: you can let it output the form for you are you can write custom walker to output each field
  • Wordsmith: add QOL twig filters like widow prevention, split name into first name/last name, smart quotes, other markdown engines, more...
  • Craft Commerce ($$$)

Troubleshooting

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment