I'm trying to setup PhpStorm, so I can simply press: "Reformat Code" ( Option CMD L), before each save - and then it'll make everything look right.
But I have this case, where I don't know how to make PhpStorm make the code right.
This is the code:
As you can see, then indentation is with tabs, but the aligning of the characters are with spaces.
I want it to look like this:
It would be cool to get the solution. But it would be even cooler to be able to figure out, how I could have found the solution myself.
Further info / idea: There is a Php Codesniffer from Squizlabs implemented. So I can fix is automatically by running a sniff fix-command. It would be pretty cool, to be able to automatically setup PhpStorm's Code style settings, to correspond with Squizlabs styles, without having to gradually tune the settings one thing at the time. But I haven't found that functionality.
Solution attempt 1: Read through all Settings >> Editor >> Code style >> PHP
I couldn't find anything that resembled this.
Solution attempt 2: Disable .editorconfig
I've read quite a bit about .editorconfig and it doesn't have these nitty-gritty functions here (as aligning equal signs).
But to make sure, I tried disabling it. Didn't make a difference.
Solution attempt 3: Search setting for 'align' and 'formatting'
But I didn't find anything useful. :-/
Solution attempt 4: Update PhpStorm
I was on PhpStorm version 2022.2.1.
I tried updating to PhpStorm version 2022.2.4.
This is still in progress.
Please show what you have at Settings (Preferences on macOS) | Editor | Code Style | PHP, specifically Tabs and Indents tab.
Checking Use tab character option with unchecked Smart tabs should do just that.
https://www.jetbrains.com/help/phpstorm/2022.3/settings-code-style-php.html#php-specific-formatting-settings-for-tabs-and-indents
(Pro tip: you can copy-paste your code sample in the preview area and start changing the options; the IDE will apply the changes live on the provided code sample instead of the default one.)
Related
I have this weird bar that shows up on some of the pages that I am working on in PhpStorm that is really annoying, as it often blocks what I am trying to work on. I can't move it or remove it. Does anyone know what it is and how to get rid of it?
This floating toolbar appears in Markdown files (not sure about any other file types, at very least I see it only there).
I see 3 icons only (in current stable PhpStorm 2022.2.3 version), which may depend on the features used (e.g. I have Diagrams plugin disabled):
Text only mode
Split mode: text + rendered preview
Rendered mode only (HTML preview)
https://www.jetbrains.com/help/phpstorm/markdown.html#preview
The other 2 icons visible on your screen MIGHT be for:
Visualizing diagrams for the Mermaid and PlantUML languages (I do not have them in any of my files so cannot check it. But it should be that).
https://www.jetbrains.com/help/phpstorm/markdown.html#diagrams
Pandoc Converter for HTML, Microsoft Word, and PDF formats (not using it myself).
https://www.jetbrains.com/help/phpstorm/markdown.html#convert-markdown-files
...it often blocks what I am trying to work on. I can't move it or remove it. Does anyone know what it is and how to get rid of it?
It is displayed in the top right corner where it is hard to cover anything.
I see no options anywhere to remove it. But you can "convert" it into the permanently visible toolbar instead if you prefer:
Help | Find Action...
Type registry to locate and invoke Registry... entry.
Once in the Registry, locate ide.text.editor.with.preview.show.floating.toolbar entry there (just start typing, the speed search works there)
Disable it (make sure it's saved) and restart the IDE. Now it will look like this (a fixed bar instead of "annoying floating" one):
I recently switched from Brackets to VS Code and I can't find a specific keyboard shortcut that I used regularly on Brackets, and I can't custom create it because I don't know how to correctly describe the command to the program.
On Brackets I used to use the keyboard shortcut Shift+Ctrl+A and with a few lines selected it would let me format the complete selection. It opened a one-line command screen on the bottom and it would let me add up different tags for HTML for example. Let's say I had a few paragraphs that I needed to format into an ol, once selected I would simply type: ol>li* in the command screen and it would automatically format the whole selection.
English is not my first language so sorry if the explanation is kind of weird! I've been searching for a solution to this for some days and I'm getting nowhere.
Things I already tried/worth noting:
Installed the Brackets keymap extension (I went through all of the keybinds and couldn't replicate this)
Checked VSCode keybinds list.
I, unfortunately, uninstalled Brackets and can't take a screenshot of the thingy. I am regretting this so much already. I should have been more aware of the keyboard shortcuts and whatever extensions I had installed.
Maybe it has to do with an extension that I'm forgetting to install?
So version before 1.30 worked fine, and did close the Tags in .html file, but as of 1.30 update I can't finish and then try to close it with
I have tried to delete config.json file, also tried to turno on every possible option for auto-close and auto-complete tags in options, but nothing worked.
And Sublime it's working fine. I downloaded plugin to transfer Sublime confing into Visual Studio Code but without success. Hope you can help me out, since i've been trying to fix this problem 3 hours now.
I had the same problem, then I noticed that my select language mode was something like Django HTML. Solved after changing it.
You might have opened a file before that changed the language mode. So first, check the language shown at the bottom-right of the VS Code window (status bar), then follow the steps bellow.
Go to settings (or edit the settins.json file) and search emmet.includeLanguages, then press add item under Emmet: Include Languages. input the language you are using in item field and html in value field.
I have a SCSS file I am currently working on. The indentation is 4 spaces, but for some reason PHPStorm only moves the cursor 2 spaces every time I tab. Is there a way to change this? Strange thing is I have other files in the project (mostly JS) and they are tabbed 4 spaces.
Settings/Preferences
Editor | Code Style
Now select your desired language (as it's configured on per language basis) and check the option on the "Tabs and Indents" tab.
If you are using the actual Tab symbol for intents then you will see the changes straight away. But if you use Space then you will need to invoke Code | Reformat Code (or similar Code | Reformat File...) to see the changes in the indents.
In case if you have changed the settings in Code Style but still see the old/different settings being applied: check if you have .editorconfig file(s) in your project and EditorConfig is enabled (by default).
The settings from such a file will overwrite your Code Style settings (it's expected as it's the nature of such files). In this case you will need to edit your .editorconfig file (or disable EditorConfig integration).
P.S. I prefer setting the basic settings (like indent size, indent symbol etc) in the .editorconfig file. It's portable, flexible, and allows setting up different settings for files that do not have dedicated Code Style settings in the IDE.
After applying the settings, the tab will not apply right away. For this to work you have to Code -> Reformat Code
You can set the tab and indent for each language you code in.
What I'm trying to do is to save the changes I make to CSS and HTML on different sites with Firebug.
Just to be clear, I don't expect Firebug to upload the changes to the server via FTP or anything. I just want to save the changes locally, so only I will be able to see them.
For example I've seen a few Firefox/Chrome extensions that add a download button under every video on Youtube, so I know it's possible to do that somehow.
If you have a different way to achieve what I'm trying to do, I'll be glad to hear about it.
(It doesn't have to be with Firebug.)
Thanks in advance!
If you don't mind using Web Developer Toolbar it's easy to save changes made to the DOM (and CSS).
When you install the toolbar, you'll get a "View Source" menu, click on that and choose "View generated source". Then just copy and paste that into a .html file.
You did not say if you alter your HTML or CSS, if CSS, FireFile is a very good addon for this.
Edit, with some Googling, i found FireDiff, which states that it can export changes made in Firebug, i have not tested it bit it's worth checking out.
You could try using Greasemonkey.
It has support for adding custom scripts that are run whenever you load a page (linked to which pages it should load on) and that can make changes to the page dynamically.
https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/
The http://chrispederick.com/work/web-developer/ web developer toolbar will let you add a user style sheet to a site which should achieve your goals.
This may or may not be exactly what you're asking for, but you can download the extension FireDiff in order to save changes made with FireBug. I made a little tutorial on how to do it here: https://www.youtube.com/watch?v=m4OmZLX2zd4
I have a somewhat simlar use-case that I solved differently. I'm not sure if it is what you are looking for or not. I'll describe the behavior and if that is helpful I'll explain exactly how I implemented it.
I changed the code that execute when you click "Run" (or Ctrl+Enter) to check to see if the first line of the code is a hard-coded string //LoadFromFile:<file path>. If it is, and the file exists then I pull the file off of the local file system and run it instead of executing the code in the console window. This way I can use an external text editor to write code.