2017-09-05 24 views
0

我正在使用CKEditor for Drupal 7.在一篇文章中,我插入了一張熱點圖片。我用ckeditor插入了html代碼(完整的html模式,源代碼視圖)。現在我想添加工具提示到多邊形,所以我試圖插入嵌套標題標籤:CKEditor 4.5.4不斷刪除標題標記的值(在Drupal 7.56中)

<polygon opacity="0" points="228,543 222,451 76,515 298,924 470,924 471,915"><title>removed by ckeditor</title></polygon>

起初我認爲它工作正常,但只要我重新打開ckeditor並查看了源代碼,標題標籤的值全部消失。標題標籤仍然存在,但是爲空。我嘗試在高級js配置中添加config.allowedContent = true;,但那不起作用。

高級內容過濾器ist在配置中關閉。

回答

0

該html無效,CKeditor用於編輯內容。所有內容應該位於<body>標籤內。在CKeditor中使用時,您的身體中包含<title>標籤。這個標籤只能用在你的html的<head>部分。

我希望CKeditor找到這個代碼,將其識別爲錯放/無效並自動刪除它。

<html> 
    <head> 
     <title>Title Here</title> 
    </head> 
    <body> 
     <script ... for ck editor /> 
     <div id="CKeditorElement"></div> 
    </body> 
</html> 

要展開對一點點,如果你改變你的<title>標記爲<label>,或只是一個<p>段落標記,這應該是罰款,儘管它會在瀏覽器(不使瀏覽器的選項卡/頂這是標題標籤的作用)。

+0

謝謝你的解釋,現在我明白了「身體問題」。標籤或段落不起作用,它們不會在鼠標懸停的工具提示中顯示。我該如何解決這個問題?也許我必須將代碼移出文章主體並將其放入外部文件中?但我不知道如何將文章與該外部html代碼連接起來。 – adamries

+0

首先,我會確定CKeditor是否完全從html中刪除它,或者它是否在視口中不可見。您可以通過檢查元素來查看內容是否被刪除。我不得不承認,我從來沒有使用過多邊形標籤,所以我不能確定它不是導致問題的原因,我不能在codepen中重現您的代碼''''樣本。如果你可以發佈一個例子,我們至少可以確定它是清除內容的drupal。 –

+0

你好,我知道標題標籤的值被刪除,因爲我可以看到在重新打開源代碼後沒有任何工具提示。 – adamries

0
<html> 
<figure id="imagemap_arbeitsplatz"> 
<svg viewBox="0 0 1122 925" > 
    <defs> 
    <style> 
    rect:hover { 
     fill: white; 
     opacity:0.3; 
     } 
    polygon:hover { 
     fill: white; 
     opacity:0.3; 
     } 
    circle:hover { 
     fill: white; 
     opacity:0.3; 
     } 
    </style> 
    </defs> 

    <image width="1122" height="925" xlink:href="/hde2017/sites/default/files/INDiD_Arbeitsplatz%20und%20Arbeitsumgebung.PNG"> 
    <title>Arbeitsplatz und Arbeitsumgebung</title> 
    </image> 

<!-------------------------------- Zugang zum Arbeitsplatz --------------------------------> 

    <!-- Bildverlinkung zu "Verkehrswege"--> 
    <a xlink:href="/hde2017/?q=node/229" > 
    <polygon points="228,543 222,451 76,515 298,924 470,924 471,915" opacity="0"/> 
     <title>Verkehrswege</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Türen, Luken und Notausgänge" --> 
    <a xlink:href="http://localhost/hde2017/?q=node/230" > 
    <polygon points="474,437 470,432 490,298 564,265 571,271 543,406" opacity="0" /> 
     <title>Tueren, Luken und Notausgaenge</title> 
    </polygon> 
    <polygon points="766,383 820,247 827,245 892,302 885,304 821,436" opacity="0" /> 
     <title>Tueren, Luken und Notausgaenge</title> 
    </polygon> 
    <polygon points="376,274 424,254 434,265 433,285 384,305 375,296" opacity="0" /> 
     <title>Tueren, Luken und Notausgaenge</title> 
    </polygon> 
    <polygon points="625,727 583,834 702,765 753,668 746,660" opacity="0" /> 
     <title>Tueren, Luken und Notausgaenge</title> 
    </polygon> 
    <polygon points="895,576 822,694 927,634 1001,528 994,521" opacity="0" /> 
     <title>Tueren, Luken und Notausgaenge</title> 
    </polygon>  
    </a> 

    <!-- Bildverlinkung zu "Rampen, Treppen und Leitern" --> 
    <a xlink:href="http://localhost/hde2017/?q=node/231" > 
    <polygon points="84,348 156,320 166,333 184,496 123,522 115,509" opacity="0" /> 
     <title>Rampen, Treppen und Leitern</title> 
    </polygon> 
    <polygon points="945,224 947,218 1016,185 1030,184 1035,176 1006,155 978,158 990,133 961,111 736,155 726,158 698,249" opacity="0" /> 
     <title>Rampen, Treppen und Leitern</title> 
    </polygon> 
    </a> 

<!-------------------------------- Beleuchtung --------------------------------> 

    <!-- Bildverlinkung zu "Raum- und Arbeitsplatzbeleuchtung, allgemeine Gestaltungsregeln"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/232" > 
    <polygon points="224,326 268,307 271,313 273,317 274,329 267,337 260,340 246,340 234,336" opacity="0"/> 
     <title>Raum- und Arbeitsplatzbeleuchtung</title> 
    </polygon> 
    <polygon points="512,209 551,193 556,199 558,205 559,213 554,218 548,222 533,222 521,217" opacity="0"/> 
     <title>Raum- und Arbeitsplatzbeleuchtung</title> 
    </polygon> 
    </polygon> 
    <polygon points="773,103 808,88 809,90 799,102 803,107 803,112 800,115 784,115" opacity="0"/> 
     <title>Raum- und Arbeitsplatzbeleuchtung</title> 
    </polygon> 

    <polygon points="813,351 825,351 836,358 842,366 842,373 835,378 820,379 815,391 827,400 839,412 846,426 848,436 847,446 837,456 826,460 813,460 798,456 776,445 764,433 755,420 753,410 753,401 758,392 766,385 774,383 795,383 812,389 817,378 812,369 808,362 808,355" opacity="0"/> 
     <title>Raum- und Arbeitsplatzbeleuchtung</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Arbeitsplatzbeleuchtung"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/233" > 
    <polygon points="682,502 675,502 672,499 672,493 674,491 679,492 679,487 680,487 679,468 682,464 686,464 697,478 701,491 699,493 694,493 692,490 695,485 680,492 685,496" opacity="0"/> 
     <title>Arbeitsplatzbeleuchtung</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Beleuchtung von Räumen mit Bildschirmarbeitsplätzen"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/234" > 
    <polygon points="" opacity="0"/> 
     <title>Beleuchtung von Räumen mit Bildschirmarbeitsplätzen</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Orientierungsbeleuchtung in Dunkelräumen"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/235" > 
    <polygon points="" opacity="0"/> 
     <title>Orientierungsbeleuchtung in Dunkelräumen</title> 
    </polygon> 
    </a> 

<!-------------------------------- Belüftung und Klimatisierung --------------------------------> 

    <!-- Bildverlinkung zu "Raumbelüftung"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/236" > 
    <polygon points="" opacity="0"/> 
     <title>Raumbelüftung</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Klimatisierung des Arbeitsraumes"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/237" > 
    <polygon points="876,410 945,476 919,519 893,532 827,467 849,423" opacity="0"/> 
     <title>Klimatisierung des Arbeitsraumes</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Klimabedingungen am Arbeitsplatz"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/238" > 
    <polygon points="300,473 300,508 308,518 384,483 386,450 378,439" opacity="0"/> 
     <title>Klimabedingungen am Arbeitsplatz</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Atemluft"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/239" > 
    <polygon points="" opacity="0"/> 
     <title>Atemluft</title> 
    </polygon> 
    </a> 

<!-------------------------------- Lärm --------------------------------> 

    <!-- Bildverlinkung zu "Grundlagen der Lärmbekämpfung"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/240" > 
    <polygon points="647,148 669,157 698,144 707,112 699,96 656,113" opacity="0"/> 
     <title>Grundlagen der Laermbekaempfung</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Luft- und Körperschallbekämpfung"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/241" > 
    <polygon points="" opacity="0"/> 
     <title>Luft- und Körperschallbekämpfung</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Organisatorische Lärmschutzmaßnahmen"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/242" > 
    <polygon points="" opacity="0"/> 
     <title>Organisatorische Lärmschutzmaßnahmen</title> 
    </polygon> 
    </a> 

<!-------------------------------- Schutz und Rettungsmittel --------------------------------> 

    <!-- Bildverlinkung zu "Augen- und Gesichtsschutz"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/243" > 
    <polygon points="" opacity="0"/> 
     <title>Augen- und Gesichtsschutz</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Gehörschutz"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/244" > 
    <polygon points="427,373 434,367 435,357 439,351 444,348 455,348 464,354 469,354 471,356 471,360 469,360 470,364 469,373 466,379 457,379 452,374 452,362 454,358 437,368 451,383 444,389" opacity="0"/> 
     <title>Gehörschutz</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Atemschutz"--> 
    <a xlink:href="http://localhost/hde2017/?q=node/245" > 
    <polygon points="" opacity="0"/> 
     <title>Atemschutz</title> 
    </polygon> 
    </a> 

    <!-- Bildverlinkung zu "Schutzbekleidung"-->  
    <a xlink:href="http://localhost/hde2017/?q=node/246" > 
    <polygon points="553,410 560,404 566,400 579,400 586,410 586,414 581,421 577,425 582,430 578,434 586,440 589,469 595,479 597,482 597,487 592,493 588,493 576,483 575,489 568,496 563,513 560,519 565,524 564,531 557,537 552,538 546,542 542,542 538,540 540,522 541,507 539,510 532,521 524,541 520,541 515,538 514,528 514,521 517,516 517,505 522,482 520,479 519,470 524,454 521,459 520,467 515,469 509,469 507,465 507,460 506,459 506,455 508,452 508,443 514,436 525,428 536,418 546,420 548,415 553,415" opacity="0"/> 
     <title>Schutzbekleidung</title> 
    </polygon> 
    <polygon points="174,484,178,491,179,498,173,500,176,507,181,511,185,516,191,520,195,520,194,514,193,506,192,497,189,487,188,476,191,467,189,459,189,450,190,445,194,449,201,449,207,449,212,450,215,451,208,444,212,447,201,438,194,434,188,428,180,425,174,427,172,418,169,410,161,409,152,408,148,414,151,420,155,426,158,430,159,434,152,440,148,448,146,460,142,470,138,480,135,488,132,496,129,506,126,512,130,514,136,510,141,499,145,491,149,483,150,476,155,469,156,477,155,487,159,496,159,506,158,516,154,515,150,521,155,528,164,534,172,538,176,529,173,520,173,512,171,494" opacity="0"/> 
     <title>Schutzbekleidung</title> 
    </polygon> 
    </a> 

</svg> 
</figure> 
</html> 
+0

起初,這段代碼的工作原理和我想要的所有工具提示,然後我再次打開ckeditor suorce視圖,所有標題都是空了,工具提示消失了。 – adamries