wp 4.1
tinymce advance 4.1.7
I put paragraphs in the editing area under text mode without any html codes.
Then trying to see how it looks on visual mode, but visual mode does not stretch as text edit mode.
Even though it is not, the front-end pages, posts and topics on bbpress which were edited appear as expected.
How can I make visual mode stretched fully as like text mode ?
I already will thank for the one who let me know.
Found solution in codex. In my remembrance, was ok to simply put editor css file into child theme dir.
Now, Wordpress 4.1 asks us to do one more task of hooking an action.
put the following code into functions.php of curent theme dir.
function my_theme_add_editor_styles() {
add_editor_style( 'custom-editor-style.css' );
}
add_action( 'admin_init', 'my_theme_add_editor_styles' );
then, put the file, custom-editor-style.css, into same dir with scripted as below:
html .mceContentBody
{max-width:99%;}
Related
i try to implement own css styles in an individual style sheet file in rte_ckeditor in TYPO3 8.7.1. I run in the problem, that modifications in the style sheet are not recognized until i rename the style sheet.
Deleting the cache dont have any effect. I presume that the browser simply does not reload the style sheet.
Any ideas?
Thanks.
I found a workaround: Open the linked style sheet in an other browser window and manually reloading (forced reload) the content of this window after every modification. Not really nice - it interrupts the workflow a bit - but it works. After reloading the css the rte shows the new styles.
Version 8.7.9 and the issue still seems to exist.
What I do as a workaround is to open the ckeditor configuration (yaml) file as well and add "?v=1" to the defined filename, e.g.:
editor:
config:
contentsCss: "EXT:tx_yourext/Resources/Public/Css/editor.css?v=1"
The yaml file does not get cached, so whenever I do changes in the CSS file, I also change the parameter inside the yaml file.
Is there any way to customize sidebar in VS Code? In particular, I want to change the font size. Is there a user setting for that? Or, maybe, I can edit it somehow via stylesheet since it's an Electron app, like in Atom?
There are no user-defined stylesheets for vscode.
The only ways to scale various parts of the UI currently are through the overall zoom level (window.zoomLevel) and the editor's font size (editor.fontSize).
I created a feature request for this on the repo.
As mentioned in other answers there are extensions which allow injecting custom CSS, you should be careful using these as they directly manipulate the source code of VS Code which could lead to problems elsewhere and any modifications could break when you update.
I Found a way to change the font of Visual Studio Code Window.
First, open command Pallete, and type "Toggle Developer Tools"
This will open "Chrome Inspector".
Select any text of sidebar of app.
Search .monaco-shell class in "styles" tab at right side inspector ( Where show every styles of the current document ), then the font-family attribute.This is tab and stylesheets.
In workbrench.main.css hit right click and click in "Open Soruce Panel" Show like this
Format the css Code with this icon.
ctrl+f for found font-family attribute again, 'cause the format redirect to end of css document, and get .monaco-shell class like this in ~6371 line.
Change this font ( I have change to Droid sans Mono font ), but you change to you want.
Why i'm not change in the real document css
'Cause, when i changed the font family in the real document css ( C:\Users\${user}\AppData\Local\Programs\Microsoft VS Code\resources\app\out\vs\workbench\workbrench.main.css) generate a error saying "Vscode have a error, please reinstall the program" or similar
When generate a actualization of application, the font family declareated will deleted, and the document css is´t a pretty code.
This process change every fonts of visual studio code application (not include the editor font )
I found it very effective to use the general zoom settings (it's somewhere in that huge settings window). This adjusts the zoom level of the entire app. Tweak it till you like the size of your explorer window, then adjust the settable editor font to be readable with that zoom level. I three parallel code windows of 80 columns plus the explorer on a good 17" laptop monitor, readable if you are OK with 8pt code font (which is actually 11 point font zoomed two notches down).
Although there is no direct way of customize the sidebar from settings as #Daniel Imms mentioned in his answer, but I found 2 plugins which helped to resolve this issue. You can either one of them if you want.
1. Custom CSS and JS Loader
In Custom CSS and JS Loader plugin, you need to create a custom css and then this plugin will inject that code directly in electron-browser/index.html(as VS Code is an electron based editor). I use this CSS in my Mac:
".explorer-viewlet .mac": "font-size: 1.2em !important",
2. CustomizeUI
CustomizeUI relies on the Monkey Patch Extension to inject custom javascript in VSCode. Here is the settings I use (in settings.json) for my Mac:
"customizeUI.stylesheet": {
".explorer-viewlet .mac": "font-size: 1.2em !important; overflow: auto; border-left:none!important",
},
The problem: How do I change the font in the instruction text box in an MIT Scratch project page. For example: make a line of text standout in bold. I believe it maybe done through editing the html code that is behind the box as I found a read only editor button that displays the code for the box. Unlike say a cell in Ipython you cannot simply surround text with tags. It seems such a simple problem but I have not found the solution yet.
Sorry, you can't do it.
The only thing you can do is to search for special font-characters and paste them in the Instruction text-box
For a day or two fairly recently this was allowed from a bug, but that bug was fixed and it's now impossible.
It's possible to change the HTML code, but that changes would only seen by you, and nobody else. There isn't a way to do it.
On the tinymce editor there is this code
// Theme options
"styleselect,formatselect,fontselect,fontsizeselect",
Are this select boxes
styleselect,formatselect,fontselect,fontsizeselect
part of a plugin or are they in a separate .js file.
I solved it this way.I opened
/var/www/tinymce/jscripts/tiny_mce/themes/advanced/editor_template.js
and i knew what advanced control was named for instance theme_advanced_blockformats:
This is the control with the block formats.To change their display names i put in this code
theme_advanced_blockformats : "Header 1=header1;Header 2=header2;Header 3=header3;Table Row=tableRow1",
and it worked.
There is that topic on tinymce website on theme_advanced_styles which serves as an excellent example http://www.tinymce.com/wiki.php/Configuration:theme_advanced_styles
I need to copy word text with image to my server through copy - paste function. For that purpose, I choose TinyMCE editor.
The editor works fine, when inserting from word just text. It also works fine, when inserting from word just picture (the picture shows in TinyMCE textarea).
However, when I copy paste word text together with image, only the text shows in textarea.
Is there any way around how to solve this issue?
Next problem is, is there a plugin for TinyMCE that would get the link to the image from TinyMCE textarea, when pasting, and save the image on server?
You should have a look at the tinymce paste plugin - this should be able to handle it.