How can I configure PhpStorm to behave consistently regarding white spaces? - phpstorm

When I create projects in PhpStorm some files have spaces for tabs and some have tabs.
I have checked show whitespaces in settings > editor > appearance - which I am assuming I supposed to be a IDE level setting, but still the behaviour is inconsistent.
Also if a file is created by an external source, PhpStorm seems to adopt whatever spacing the file has also.
Even after enabling use tabs Phpstorm uses spaces, is this because Phpstorm is using a file-specific configuration - which is overriding both the project level and IDE level settings?
Does Phpstorm have any option which allows you to define a setting - e.g. use tabs and have the setting apply to all files, even if they were generated by a program which used spaces instead of tabs?

Related

How to align code, in PhpStorm / Intellij, using tabs (and not spaces)

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.)

PhpStorm: Save as Live Template does nothing

Trying to create a Live Template in PhpStorm by highlighting a block of text, going to Tools > Save as Live Template.
When I do this, nothing happens. The Live Template dialog does not open and there is no other indication of an error. I can manually open the Live Template menu and add one there.
Is there a setting or configuration that is needed for this to be enabled?
PhpStorm 2017.1.4 on Windows 10
You can turn a highlighted block into a live template, but you need to make sure that there is no leading whitespace in your selected text, or it won't do anything, as explained in the original question.
This is likely a bug, see the issue in the comments to track resolution.

How to make permanent changes to a website's CSS from within the browser?

If I am trying to edit some CSS in a huge project using the built-in developer tools in Firefox (which is accessed by right click and then selecting Inspect Element), is there a way to make those changes permanent?
Actually there is a big number of style sheets and and I could not locate this one property in them? I just could not find the file which contains this property, so I want to make permanent changes to the CSS from within the browser. Is there a way?
EDIT:-
To set up in Chrome first you have to add your project file to a "Workspace", Go into dev tools Ctrl+Shift+I then click on the settings gear and on the left yoou should see Workspace.
After you have added your Project folder into a workspace close out of options and click on the "Sources" tab (still in dev tools)
Now load up your index.html from your LocalHost like you normally would. In the sources panel you should see the currently loaded page and its resources. Right click on your .css file and click "Map To File System Resource" it will bring up a search box where you can search for the corresponding .css file from your actual project folder (that is now part of a workspace in Chrome). Once you make the link Chrome is smart enough to link up any other CSS and HTML files that are in your Project Folder.
Now you can make changes in the Elements tab in Chrome Dev Tools and they changes will persist. Also in the ELements tab it will show you what css file and what line any given Style is originating from!
The best thing about this is if you use Sass or Less then it will map your Scss files back to the CSS styles being processed in Chrome. (please note if using Sass and Less you have to have CSS source maps turned on)
If you don't want to do this by hand, there is a plugin for FF called Stylish that allows you to define rules-based style tweaks.
EDIT
I mention this only because it allows you to publish a set of style changes that any Firefox client can pick up and install to a specific installation. Since one can't "permanently" change the contents of remote style information, the only solution is to manipulate it on a semi-permanent basis on each user-agent that needs the changes.
You can use the Web Developer Toolbar for this matter. By going to CSS menu and then to 'Edit CSS' where you can edit and save your changes. Il also provides tools for identify which files are relevant and modify them manually. Also you may try Firebug extension where you can do similar things.
Links to both here:
https://addons.mozilla.org/firefox/addon/web-developer/
https://addons.mozilla.org/firefox/addon/firebug/
If you have installed Firebug you could install cssUpdater to simplify the process of saving changes.
https://addons.mozilla.org/firefox/addon/cssupdater/
You can take a look at userContent.css:
http://www-archive.mozilla.org/unix/customizing.html#usercss

Razor pages (cshtml) render HTML markup without the classic colors

I'm working on a web project in Visual Studio 2013 and I'm not able to see the classic colors for HTML tags (Maroon, Blue and Red). Instead all the HTML is black, except the Razor blocks, they show ok.
When I go to the Fonts options the colors are configured correctly but the editor seems to not consider the configuration values.
Any help would be appreciated.
Do you mean that the source code doesn't have syntax highlighting within the Visual Studio editor, outside of the Razor blocks?
It's possible that your default editor for cshtml files got switched to the wrong one somehow. Try right-clicking one of the cshtml files in question, doing an "Open With...", and choosing "HTML Editor".
If that doesn't work, try disabling any extensions you have installed that touch the HTML editor (e.g. Web Essentials, Productivity Power Tools, Indent Guides, etc).
If that doesn't work, I'd try resetting your settings from Tools > Import and Export Settings... > Reset all settings. You can back your settings up first, so you can restore them afterward if resetting them doesn't help.
Finally, if none of that works, I would try running a repair on Visual Studio from the installer. I've seen that fix strange issues like this before.

Changing Spaces Per Tab in PHPStorm

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.