2174  1

#joomla[fag] :: экспорт материалов из MS Word на сайт (HTML)

Поводом для написания этой статьи послужили частые затруднения клиентов с переносом материалов (статей) из текстового редактора MS Word на свои сайты. Поэтому, нужно было разработать какой-то простой и понятный алгоритм, который бы позволил людям не знакомым с HTML разметкой, корректно вносить материалы на свои сайты.

#joomla[fag] :: экспорт материалов из MS Word на сайт (HTML)

Перепробовав, в прямом смысле, десятки вариантов, из разных текстовых редакторов в разные конвертеры, я хочу порекомендовать, на мой взгляд, самый простой и корректный способ конвертации форматированного текста из MS Word в «чистый» HTML.

Итак. Текстовый редактор MS Word недаром называют монстром среди себе подобных. Крохотный кусочек текста:

превращается в 372 (!) строки кода разметки HTML. Не нужно быть семи пядей во лбу, чтобы понять, что с этим нужно что-то делать!

<!-- [if gte mso 9]><xml>
	<w:WordDocument>
	<w:View>Normal</w:View>
	<w:Zoom>0</w:Zoom>
	<w:TrackMoves/>
	<w:TrackFormatting/>
	<w:HyphenationZone>21</w:HyphenationZone>
	<w:PunctuationKerning/>
	<w:ValidateAgainstSchemas/>
	<w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>
	<w:IgnoreMixedContent>false</w:IgnoreMixedContent>
	<w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>
	<w:DoNotPromoteQF/>
	<w:LidThemeOther>UK</w:LidThemeOther>
	<w:LidThemeAsian>X-NONE</w:LidThemeAsian>
	<w:LidThemeComplexScript>X-NONE</w:LidThemeComplexScript>
	<w:Compatibility>
	<w:BreakWrappedTables/>
	<w:SnapToGridInCell/>
	<w:WrapTextWithPunct/>
	<w:UseAsianBreakRules/>
	<w:DontGrowAutofit/>
	<w:SplitPgBreakAndParaMark/>
	<w:DontVertAlignCellWithSp/>
	<w:DontBreakConstrainedForcedTables/>
	<w:DontVertAlignInTxbx/>
	<w:Word11KerningPairs/>
	<w:CachedColBalance/>
	</w:Compatibility>
	<w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel>
	<m:mathPr>
	<m:mathFont m:val="Cambria Math"/>
	<m:brkBin m:val="before"/>
	<m:brkBinSub m:val="--"/>
	<m:smallFrac m:val="off"/>
	<m:dispDef/>
	<m:lMargin m:val="0"/>
	<m:rMargin m:val="0"/>
	<m:defJc m:val="centerGroup"/>
	<m:wrapIndent m:val="1440"/>
	<m:intLim m:val="subSup"/>
	<m:naryLim m:val="undOvr"/>
	</m:mathPr></w:WordDocument>
	</xml><![endif]--></code</pre>
	<p class="MsoNormal"><i style="mso-bidi-font-style: normal;"><span style="mso-ansi-language: RU;" lang="RU">«Однажды»</span></i><span style="mso-ansi-language: RU;" lang="RU"> <b style="mso-bidi-font-weight: normal;">в студеную</b> <b style="mso-bidi-font-weight: normal;"><i style="mso-bidi-font-style: normal;">зимнюю</i></b> <u>пору.</u></span></p>
	<p class="MsoNormal"><span style="mso-ansi-language: RU;" lang="RU">Нумерованный список:</span></p>
	<p class="MsoListParagraphCxSpFirst" style="text-indent: -18.0pt; mso-list: l0 level1 lfo1;"><span style="mso-bidi-font-family: Calibri; mso-bidi-theme-font: minor-latin; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">1.<span style="font: 7.0pt 'Times New Roman';">       </span></span></span><span style="mso-ansi-language: RU;" lang="RU">Раз;</span></p>
	<p class="MsoListParagraphCxSpMiddle" style="text-indent: -18.0pt; mso-list: l0 level1 lfo1;"><span style="mso-bidi-font-family: Calibri; mso-bidi-theme-font: minor-latin; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">2.<span style="font: 7.0pt 'Times New Roman';">       </span></span></span><span style="mso-ansi-language: RU;" lang="RU">Два;</span></p>
	<p class="MsoListParagraphCxSpLast" style="text-indent: -18.0pt; mso-list: l0 level1 lfo1;"><span style="mso-bidi-font-family: Calibri; mso-bidi-theme-font: minor-latin; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">3.<span style="font: 7.0pt 'Times New Roman';">       </span></span></span><span style="mso-ansi-language: RU;" lang="RU">Три;</span></p>
	<p class="MsoNormal"><span style="mso-ansi-language: RU;" lang="RU">Маркированный список:</span></p>
	<p class="MsoListParagraphCxSpFirst" style="text-indent: -18.0pt; mso-list: l1 level1 lfo2;"><span style="font-family: Symbol; mso-fareast-font-family: Symbol; mso-bidi-font-family: Symbol; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">·<span style="font: 7.0pt 'Times New Roman';">         </span></span></span><span style="mso-ansi-language: RU;" lang="RU">четыре;</span></p>
	<p class="MsoListParagraphCxSpMiddle" style="text-indent: -18.0pt; mso-list: l1 level1 lfo2;"><span style="font-family: Symbol; mso-fareast-font-family: Symbol; mso-bidi-font-family: Symbol; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">·<span style="font: 7.0pt 'Times New Roman';">         </span></span></span><span style="mso-ansi-language: RU;" lang="RU">пять;</span></p>
	<p class="MsoListParagraphCxSpMiddle" style="text-indent: -18.0pt; mso-list: l1 level1 lfo2;"><span style="font-family: Symbol; mso-fareast-font-family: Symbol; mso-bidi-font-family: Symbol; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">·<span style="font: 7.0pt 'Times New Roman';">         </span></span></span><span style="mso-ansi-language: RU;" lang="RU">вышел;</span></p>
	<p class="MsoListParagraphCxSpMiddle" style="text-indent: -18.0pt; mso-list: l1 level1 lfo2;"><span style="font-family: Symbol; mso-fareast-font-family: Symbol; mso-bidi-font-family: Symbol; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">·<span style="font: 7.0pt 'Times New Roman';">         </span></span></span><span style="mso-ansi-language: RU;" lang="RU">зайчик;</span></p>
	<p class="MsoListParagraphCxSpLast" style="text-indent: -18.0pt; mso-list: l1 level1 lfo2;"><span style="font-family: Symbol; mso-fareast-font-family: Symbol; mso-bidi-font-family: Symbol; mso-ansi-language: RU;" lang="RU"><span style="mso-list: Ignore;">·<span style="font: 7.0pt 'Times New Roman';">         </span></span></span><span style="mso-ansi-language: RU;" lang="RU">погулять.</span></p>
	<pre class="brush:xml">
	<!-- [if gte mso 9]><xml>
	<w:LatentStyles DefLockedState="false" DefUnhideWhenUsed="true"
	DefSemiHidden="true" DefQFormat="false" DefPriority="99"
	LatentStyleCount="267">
	<w:LsdException Locked="false" Priority="0" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Normal"/>
	<w:LsdException Locked="false" Priority="9" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="heading 1"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 2"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 3"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 4"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 5"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 6"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 7"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 8"/>
	<w:LsdException Locked="false" Priority="9" QFormat="true" Name="heading 9"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 1"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 2"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 3"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 4"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 5"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 6"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 7"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 8"/>
	<w:LsdException Locked="false" Priority="39" Name="toc 9"/>
	<w:LsdException Locked="false" Priority="35" QFormat="true" Name="caption"/>
	<w:LsdException Locked="false" Priority="10" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Title"/>
	<w:LsdException Locked="false" Priority="1" Name="Default Paragraph Font"/>
	<w:LsdException Locked="false" Priority="11" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Subtitle"/>
	<w:LsdException Locked="false" Priority="22" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Strong"/>
	<w:LsdException Locked="false" Priority="20" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Emphasis"/>
	<w:LsdException Locked="false" Priority="59" SemiHidden="false"
	UnhideWhenUsed="false" Name="Table Grid"/>
	<w:LsdException Locked="false" UnhideWhenUsed="false" Name="Placeholder Text"/>
	<w:LsdException Locked="false" Priority="1" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="No Spacing"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 1"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 1"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 1"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 1"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 1"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 1"/>
	<w:LsdException Locked="false" UnhideWhenUsed="false" Name="Revision"/>
	<w:LsdException Locked="false" Priority="34" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="List Paragraph"/>
	<w:LsdException Locked="false" Priority="29" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Quote"/>
	<w:LsdException Locked="false" Priority="30" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Intense Quote"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 1"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 1"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 1"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 1"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 1"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 1"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 1"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 1"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 2"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 2"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 2"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 2"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 2"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 2"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 2"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 2"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 2"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 2"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 2"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 2"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 2"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 2"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 3"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 3"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 3"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 3"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 3"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 3"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 3"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 3"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 3"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 3"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 3"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 3"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 3"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 3"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 4"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 4"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 4"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 4"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 4"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 4"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 4"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 4"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 4"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 4"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 4"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 4"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 4"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 4"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 5"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 5"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 5"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 5"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 5"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 5"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 5"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 5"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 5"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 5"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 5"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 5"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 5"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 5"/>
	<w:LsdException Locked="false" Priority="60" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Shading Accent 6"/>
	<w:LsdException Locked="false" Priority="61" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light List Accent 6"/>
	<w:LsdException Locked="false" Priority="62" SemiHidden="false"
	UnhideWhenUsed="false" Name="Light Grid Accent 6"/>
	<w:LsdException Locked="false" Priority="63" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 1 Accent 6"/>
	<w:LsdException Locked="false" Priority="64" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Shading 2 Accent 6"/>
	<w:LsdException Locked="false" Priority="65" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 1 Accent 6"/>
	<w:LsdException Locked="false" Priority="66" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium List 2 Accent 6"/>
	<w:LsdException Locked="false" Priority="67" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 1 Accent 6"/>
	<w:LsdException Locked="false" Priority="68" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 2 Accent 6"/>
	<w:LsdException Locked="false" Priority="69" SemiHidden="false"
	UnhideWhenUsed="false" Name="Medium Grid 3 Accent 6"/>
	<w:LsdException Locked="false" Priority="70" SemiHidden="false"
	UnhideWhenUsed="false" Name="Dark List Accent 6"/>
	<w:LsdException Locked="false" Priority="71" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Shading Accent 6"/>
	<w:LsdException Locked="false" Priority="72" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful List Accent 6"/>
	<w:LsdException Locked="false" Priority="73" SemiHidden="false"
	UnhideWhenUsed="false" Name="Colorful Grid Accent 6"/>
	<w:LsdException Locked="false" Priority="19" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Subtle Emphasis"/>
	<w:LsdException Locked="false" Priority="21" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Intense Emphasis"/>
	<w:LsdException Locked="false" Priority="31" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Subtle Reference"/>
	<w:LsdException Locked="false" Priority="32" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Intense Reference"/>
	<w:LsdException Locked="false" Priority="33" SemiHidden="false"
	UnhideWhenUsed="false" QFormat="true" Name="Book Title"/>
	<w:LsdException Locked="false" Priority="37" Name="Bibliography"/>
	<w:LsdException Locked="false" Priority="39" QFormat="true" Name="TOC Heading"/>
	</w:LatentStyles>
	</xml><![endif]--><!-- [if gte mso 10]>
	<style>
	/* Style Definitions */
	table.MsoNormalTable
	{mso-style-name:"Обычная таблица";
	mso-tstyle-rowband-size:0;
	mso-tstyle-colband-size:0;
	mso-style-noshow:yes;
	mso-style-priority:99;
	mso-style-qformat:yes;
	mso-style-parent:"";
	mso-padding-alt:0cm 5.4pt 0cm 5.4pt;
	mso-para-margin-top:0cm;
	mso-para-margin-right:0cm;
	mso-para-margin-bottom:10.0pt;
	mso-para-margin-left:0cm;
	line-height:115%;
	mso-pagination:widow-orphan;
	font-size:11.0pt;
	font-family:"Calibri","sans-serif";
	mso-ascii-font-family:Calibri;
	mso-ascii-theme-font:minor-latin;
	mso-hansi-font-family:Calibri;
	mso-hansi-theme-font:minor-latin;
	mso-bidi-font-family:"Times New Roman";
	mso-bidi-theme-font:minor-bidi;
	mso-fareast-language:EN-US;}
	</style>
<![endif]-->

В этой статье я буду рассматривать перенос материала из MS Word на сайт построенный на CMS «Joomla», но я думаю, что и для большинства других CMS данный метод будет вполне приемлем. Для примера возьмем вышеприведенный текст с самым простым форматированием, чтобы показать все плюсы и минусы данного метода.

Самым популярным wysiwyg redactor’ом в CMS «Joomla» является «Editor – JoomlaCK». Вот его работу мы и рассмотрим – сможем мы вставить материал из MS Word легко и быстро, или нет. Для начала возьмем небольшой кусочек текста:

«Однажды в студеную зимнюю пору.»

имеющий несколько примеров самого разного форматирования: курсив, жирний текст, жирний курсив и подчеркнутый. Если его «со старта» забросить в CKEditor, то результат получится весьма приемлемым:

Давайте теперь поставим весь кусок:

«Однажды» в студеную зимнюю пору.

Нумерованный список:

  1. Раз;
  2. Два;
  3. Три;

Маркированный список:

  • четыре;
  • пять;
  • вышел;
  • зайчик;
  • погулять.

и посмотрим на код, что у нас получился в редакторе CKEditor:

		<p><em>&laquo;Однажды&raquo;</em><strong>в студеную</strong> <strong><em>зимнюю</em></strong> <u>пору.</u></p>
		<p>Нумерованный список:</p>
		<p>1.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Раз;</p>
		<p>2.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Два;</p>
		<p>3.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Три;</p>
		<p>Маркированный список:</p>
		<p>&middot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; четыре;</p>
		<p>&middot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; пять;</p>
		<p>&middot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; вышел;</p>
		<p>&middot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; зайчик;</p>
		<p>&middot;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; погулять.</p>

Как видим, данный вариант весьма и весьма далек от идеала: огромное количество неразрывных пробелов « »; маркированный и нумерованный списки реализованы без соответствующих тегов, что совсем нас не устраивает. Что же делать, спросите вы?

Выход, к нашей огромной радости очень простой. Есть в Интернете такой замечательный онлайн-сервис – www.textfixer.com Как было сказано выше, я перепробовал несколько десятков подобных сервисов. И с загрузкой файлов, и без загрузки, как в данном случае – везде результат желал оставлять много-много лучшего! В большинстве сервисов оптимизированный код вообще мало чем отличался от «вордовского».

Давайте вставим весь наш «кусок» текста в онлайн-форму на указанном сайте.

Нажимаем кнопочку «Convert Word to HTML», и смотрим, что он нам выдал:

		<p><i>&laquo;Однажды&raquo;</i> <b>в студеную</b> <b><i>зимнюю</i></b> пору.</p>
		<p>Нумерованный список:</p>
		<p>1. Раз;</p>
		<p>2. Два;</p>
		<p>3. Три;</p>
		<p>Маркированный список:</p>
		<p>&middot; четыре;</p>
		<p>&middot; пять;</p>
		<p>&middot; вышел;</p>
		<p>&middot; зайчик;</p>
		<p>&middot; погулять.</p>

Как видим, здесь тоже нет тегов нумерованного и маркированного списков, но и неразрывных пробелов « » в огромном количестве тоже нет!

Выделяем все, что есть в форме (Ctrl+A). Копируем (Ctrl+C). Переходим на свой сайт в форму редактора JoomlaCK. Нажимаем кнопку «Источник», и уже здесь вставляем полученный код.

После вставки кода 1. (Ctrl+V), опять нажимаем кнопку «Источник» (2)

С помощью панели инструментов (см. рис. ниже), делаем нумерованный и маркированные списки (если это необходимо). Прямо в редакторе все полностью форматируем, вставляем изображения.

В результате, наш текст принимает нормальный вид, и на сайте будет отображаться согласно установленным стилям:

Можно указывать остальные параметры материала, и сохранять.

Аналогично текст форматируется и в редакторе TinyMCE, который с CMS «Joomla» идет в стартовой комплектации.

Чтобы вставить в редактор TinyMCE оптимизированный код, который мы получили в онлайн форме на сайте www.textfixer.com

нужно в редакторе открыть окно вставки и редактирования исходного HTML кода:

И уже в это окно вставить полученный оптимизированный код. Нажимаем кнопку «OK»

Редактируем и форматируем текст с помощью штатной панели инструментов редактора.

Сохраняем полученный результат.

Итак. После небольшого форматирования, прямо в штатном wysiwyg редакторе, получаем чистый код:

		<p><i>&laquo;Однажды&raquo;</i> <b>в студеную</b> <b><i>зимнюю</i></b> <u>пору.</u></p>
		<p>Нумерованный список:</p>
		<ol>
			<li>Раз;</li>
			<li>Два;</li>
			<li>Три;</li>
		</ol>
		<p>Маркированный список:</p>
		<ul>
			<li>четыре;</li>
			<li>пять;</li>
			<li>вышел;</li>
			<li>зайчик;</li>
			<li>погулять.</li>
		</ul>

Описывать и читать достаточно долго. Но, на самом деле, все делается довольно быстро. Главное четко придерживаться алгоритма, и тогда все ваши материалы на сайте будут строго соответствовать установленным вами стилям.

Если статья была вам полезна – поделитесь в соцсетях (кнопочки выше), может еще кому пригодится ;). Хотите прокомментировать – форма перед вами.

Удачи, Мира и Добра.

UPD-2018 – сейчас эта статья уже как-бы не актуальна, поскольку даже стандартный визуальный редактор TinyMC очень даже неплохо справляется с этой задачей. Однако, если у кого возникнет такая проблема – решение перед вами ;)

Если вам понравилась эта статья – комментируйте, делитесь в социальных сетях (кнопки «Поделиться» слева страницы).

Удачи, Мира и Добра!

Если вы уже зарегистрированы на этом сайте, или уже оставляли здесь свои комментарии, отзывы, заявки на участие в акциях, чтобы добавить ещё один комментарий – авторизуйтесь

Добавить комментарий

Комментарии


«ArtInWeb.biz»
  • #14

UA :: У коментарях ви можете щось додати або уточнити, у т.ч. поділитися вашим кодом.


RU :: В комментариях вы можете что-то добавить или уточнить, в т.ч. поделиться вашим кодом.


EN :: In comments you can add or clarify something, including share your code.



© «ArtInWeb.biz» – веб-разработка полного цикла

Последний раз редактировалось: 03/04/2020