TYPO3 - BE/FE/Env Handy Switcher

https://github.com/w010/chrome-typo3-switcher ** NEW FEATURES: - Now it works with ANY CMS using CUSTOM BACKEND PATH option - BACKEND DEEP LINKING works with Page, Language, News, Custom records - Project Repository > MANIFEST 3 UPDATE - PLEASE TAKE A LOOK INTO MY GITHUB AND HELP FINISHING MIGRATION - IT STILL NEEDS SOME TREATMENT ** What's that (and for who)? It's a productivity everyday time saver / navigation helper for CMS web projects, originally dedicated to TYPO3 integrators / devs / editors / project managers. Especially recommended for those who works with a large number of projects that runs multiple instances / continuous integrated etc. - But it's a great work improvement for everyone who works with CMS on everyday basis. Non-TYPO3 people also finds it very usable - so the "/typo3" segment is configurable, making the ext system-independent and universal. In short words, simple yet advanced - it can drastically simplify everyday navigating through your projects instances / their backends / trackers / repos / whatsoever. Forget searching for bookmarks, which usually throws you to homepage anyway, forget clicking again and again through some sub-sub-menus looking for that one subpage on stage that you just edited on dev, or copy-pasting paths from domain to domain every time... Have all instances within a click, teleporting from one to another in a second, always landing exactly where you wanted. + With minimum effort and easy config exchange it helps to keep full url sets always up to date for all team members. (see: Project Repository section) ** So what does it do? - One basic function is the toolbar button which opens TYPO3 Backend of current site (base href-based), or returns to Frontend, if already there. But it offers much more than that. - Magic starts when you work with many projects that runs on multiple staging environments and frequently jump between them. Go to the options and start using Projects configurations - create or import from your teammates. Name the new project and set all urls for environments / contexts / servers. Now you can quick jump between them keeping path (go straight to the very same subpage). It shows color badge and favicon overlay on each one to visually distinguish and always have a good overview where you are (and avoid mistakes like messing on the wrong one - set red for public servers and you never miss that again). You can also add some project-related links (like issue tracker, wiki, repo etc) to show in project's context menu. - Projects can be easy exported/imported in json format (all or separately) to share with your team / post to wiki / etc. There's also more advanced PROJECT REPO FUNCTIONALITY, where you can synchronize/share your projects with remote hosted repository. - SWITCHING TO BACKEND TRIES TO FIND CURRENT PAGE UID IN THE PAGE SOURCE AND GO DIRECTLY TO THAT PAGE EDITION. It also supports language, News and CUSTOM RECORDS. (it just needs typical html/body classes for that, - and metatag for custom records) (tested in versions 11.5 - 12.4) (See section below for details) - Switching to Frontend tries to use current pagetree-selected Page UID and open it instead of just base url (similar to "View webpage" button in backend, but works even if you're in a module without page tree or such button). (you can turn off this behaviour) [note, it doesn't respect multidomains - probably impossible to implement easy] - If you rather go simply, you may turn off all that fancy environment-related functions, and use only BE/FE switch button to keep lightweight. (but why give up all these great features?) > Note, that THIS EXT DOESN'T LOAD ANY BIG VENDOR JS LIBS IN ITS BACKGROUND INSTANCE (only some in options panel) so it doesn't eat too much memory. ** BACKEND DEEP LINKING 1. Out of the box it works with PAGE ID, LANGUAGE and NEWS - it can open Backend linking directly to the edit form. It needs typical class or id of <html> or <body>: Example: <body class="page-123 language-2 news-456"> will allow to fetch these uids. (many projects has this already anyway) 2. CUSTOM RECORDS can be configured by adding similar way, for example <body class="product-789"> and then adding simple meta tag config into <head> this way: (for example, using Typoscript:) page.headerData.7700 = TEXT page.headerData.7700 = TEXT.value ( <meta name="handyswitcher" content='{ "deeplink": { "products": { "table": "tx_myext_domain_model_product", "module": "edit", "pattern": "(?:product)(?:-|_)(\\d+(\\.\\d)*)", "selector": "body", "attr": "class" }}}'> - that will make possible the Switcher will open backend edit form for the specified record, when switching to Backend from product detail page Frontend. Configuration ref: 'table' - record db table name, used to build backend url 'module' - 'edit' (default) or 'page' 'pattern' - ready pattern to match string 'selector' - it will search for that keyword/pattern in that tag 'attr' - in that attribute of that tag ** PROJECT REPOSITORY This ext now has a functionality to synchronize Projects with external Project Repo, where you can store, manage and exchange projects with your team - to always keep all urls sets up to date and ready to use. You can push, fetch and compare Project configurations, also managing simple user roles (read, write, admin access) For that to be possible I wrote a tiny web app for easy hosting of the repository on your server: http://wolostudio.free.nf/handyswitcher/repoexample/ Code: https://github.com/w010/handy-switcher-project-repo/ It's almost zero-config and easy to run, just clone it somewhere on your server and open web gui for details. That app was originally meant for my private use, so it's rather simple and doesn't provide much of security - it was made rather for presenting the concept. But it works well, if you don't forget to set htaccess password. If you need it to be more pro for your purposes, use it as a base for writing something better, ie. TYPO3 extension... ** SECURITY TRUST: See FAQ ** Story: There was that Chrome ext for opening backend, some time ago ("Fast TYPO3 CMS Backend switch"), but it only opened current domain + /typo3/ segment - I've used it for a long time though. Thanks to the author of it, Patrick Lischka, for inspirations to improve this idea.</p> - My ext goes much further and it can open back the Frontend from Backend, also it can not only add a path to a domain, but tries to fetch the <base> tag from source, then uses it for a backend url build (or just a domain, if not found). So it works as expected when running project in a subdirectory, ie. on your dev environment. (even though that approach is not recommended and usually leads to misc problems with some extensions - like buggy ajax in formhandler - many people works that way and I needed to handle that to avoid everyday frustration) (For this to work, it needs that <base href="[url]"> is set in <head>, so if you rather use absRefPrefix, I have no idea, how to help you) Please write me any problems, suggestions or ideas and feel free to report issues on Github. https://github.com/w010/chrome-typo3-switcher/issues wolo '.' studio 2017-2025 ** Legal: TYPO3 and its logo are trademarks of the TYPO3 Association. http://typo3.org/about/the-trademarks/ ** Icons based on: https://github.com/TYPO3/TYPO3.Icons https://typo3.org/about/the-brand/style-guide/the-typo3-logo/

Screenshots from Chrome Web Store