"Customize your text alignment with TinyMCE's align

I'm in the process of updating from an outdated version of TinyMCE to the most recent release. In the old TinyMCE, if you inserted an image and aligned it to the left, the HTML generated looked like this:

< img src="testing.jpg" align="left" >

However, with the new version of TinyMCE, it now generates HTML like this:

< img src="testing.jpg" style="float: left" >

Unfortunately, this new HTML doesn't display correctly in Outlook. Do you have any suggestions on how I can resolve this problem without having to make changes to the core TinyMCE code?

Thank you!

javascripttinymcealignment

Answer №1

While initializing, you have the option to include a format like so:

formats : {
            alignleft : {attributes : {align : "left"}}
          }

Try implementing this and see if it suits your needs. For more detailed information, refer to this link

UPDATE: It seems that in addition to defining formats, selectors are necessary to specify which elements should follow these rules:

alignleft : {selector : 'img', attributes :{align : "left"} }

You can view a functional demo here

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Testing a Component Function in ReactJS: A Step-by-Step Guide

Testing methods in a Meteor application using mocha/chai can be done like this: describe('postMessage', () => { it('should add message', (done) => { // EXECUTE const messageId = postMessage.call({ articleId: 123, conten ...

javascriptreactjsunit-testingmeteorchai

The visibility of buttons can be controlled based on the selected radio option

I have just completed setting up 4 buttons (add, edit, delete, cancel) and a table that displays data received via ajax. Each row in the table contains a radio button identified by the name "myRadio". When a radio button is clicked, I need the buttons to ...

javascriptjquerybootstrap-4

The following middleware is not functioning properly on a local SSL server

When I run my Nextjs app without SSL using "next dev", the middleware functions as expected without any errors. However, if I attempt to run the app with SSL enabled, an empty middleware function triggers an error. The code for the middleware function (l ...

javascriptnode.jsreactjssslnext.js

Ways to obtain the index of a button

Once upon a time, I used to create a plethora of buttons using a for loop. The title[] array was filled with numerous values. export const renderButtons1 = (numOfBtns,title,navigate) => { const views1 = []; for ( var i = 0; i < numOfBtns; ...

javascriptreactjsreact-native

The messaging feature is not functioning properly within the page tab

The iframe page tab is not compatible with the Send dialog. I followed the example on the 'Send Dialog' page https://developers.facebook.com/docs/reference/dialogs/send/ <html xmlns:fb="https://www.facebook.com/2008/fbml"> <body> ...

javascriptfacebookdialogfacebook-javascript-sdk

Troubleshooting Angular 2 Fallback Route Failure

My current project is using Angular 2 Webpack Starter but I am having trouble with the fallback route. In my app.routes.ts file, I have defined the routes as follows: import { Routes } from '@angular/router'; import { HomeComponent } from &apos ...

javascriptangulartypescriptwebpackangular2-routing

Is it possible to alter the JSON file being loaded in AngularJS by passing a variable?

I am in need of loading the content from either food1.json or food2.json, and I am attempting to achieve this within the html template: <body ng-controller="MainCtrl" ng-init="init('food1')"> Subsequently, in the JavaScript code: $scop ...

javascriptjsonangularjs

Generate and save a document

Upon clicking the button, I am trying to generate a CSV file and download it right away. My current approach is as follows: html: <a class="btn btn-primary" @click="downloadCsv">Download CSV</a> <a v-if="fileObjectUrl !== null" ref="down ...

javascriptvue.js

Issues with POST data not being received by MVC 4 APIController

Although this issue has been addressed numerous times, I am still unable to pinpoint the error! Here is a straightforward JS script that sends data back to the ApiController. function WebCall(url,parameterObject, callBackFunction) { this.callbackfunction ...

javascriptjqueryasp.net-mvchttp-post

Transferring information from JavaScript to PHP

I am trying to send both the data and text that are within a single DIV tag using JavaScript into PHP values. However, I am encountering an issue with the following code: <html> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jq ...

javascriptphp

Node.js error: exceeding parameter limit encountered during bulk data upload

I've been tasked with uploading user data in bulk via a CSV file. I'm utilizing nodejs along with the express framework. Everything works smoothly when I upload a CSV file with 60 to 70 rows, but once it exceeds 70 rows, I start encountering a se ...

javascriptnode.jsbody-parser

Invoke a Google Apps Script through AJAX that necessitates authentication

I am looking to access a Google Apps Script via AJAX that requires user authorization to send an email from their Gmail account. The challenge lies in the fact that I need to send the email from within the Google Apps Script. The call originates from my w ...

javascriptajaxgoogle-apps-scriptoauth-2.0google-oauth

Trouble Navigating the DOM

Can you assist me in choosing the correct option c? Below is the provided HTML code: <div id="a"> <div id="b"></div> <div id="app7019261521_the_coin_9996544" style="left: 176px; top: 448px;"> <a href="d.com" oncl ...

javascriptjquerygreasemonkey

Struggling to implement a vertical scroll bar in HTML code?

<body ng-app="myApp" ng-controller="myCtrl"> <div ng-show = "dataFromRest" ng-repeat = "x in dataFromRest.posts" > <div class="tittle" style="width: 25%;"> <a href="" ng-click="showDi ...

javascripthtmlcssangularjs

Using Javascript in the Model-View-Controller (MVC) pattern to load images stored as byte

Despite the numerous solutions available on Stack Overflow, I am still unable to get any of them to work... I am faced with the challenge of setting the "src" attribute of an image tag using a byte array obtained from an ajax call to my controller in Java ...

javascriptajaximagearrayssrc

A Step-by-Step Guide to Downloading Images by Clicking

Having an issue with my image download code. When I try to download an image, the process starts but doesn't complete and no file is received. Instead, a type error is encountered. <html> <head> <script type="text/javascript"> funct ...

javascriptjqueryhtml

Error: The object 'exports' is not defined in geotiff.js at line 3

Looking to integrate the geotiff library with Angular 6.1.0 and TypeScript 2.9.2. Installed it using npm i geotiff Encountering the following error in the browser console: Uncaught ReferenceError: exports is not defined at geotiff.js:3 After r ...

javascriptangulartypescript

A comprehensive guide on retrieving data from API across several pages

Struggling with pulling data from an API using React and facing the challenge of retrieving more than one page of data. "info": { "count": 493, "pages": 25, "next": "https://rickandmortyapi.com/api/character/?pa ...

javascriptreactjsjsonfetch-api

Show a specific item when selecting an option from a dropdown menu

Hey there, I have a question regarding creating a theme for the Genesis Framework. Right now, I'm facing a challenge with one particular element. Here's the situation: I've got two drop-down lists, but I only want the second one to be visib ...

javascriptjqueryhtmlwordpressdrop-down-menu

Tips for displaying HTML5 validation messages when the input is changed

I am working on a form where I prefer not to submit it directly, as I am making an AJAX call instead. However, I still want the HTML5 validation messages to show up when an input field is left empty. I have managed to display the validation message when a ...

javascriptjqueryhtmlvalidation