Skip to main content
P
PizzaPasta
Inspiring
May 5, 2017
Answered

Tabs einfügen: Irritierende Meldung

  • May 5, 2017
  • 1 reply
  • 1006 views

Guten Tag

Wenn ich mit DW2017 die Bootstrap-Komponente "Tabs" einfüge, erscheint die folgende Meldung:

Die Komponente ist mit der aktuellen Bootstrap-CSS/JS-Datei (älter als Version 3.0) nicht vollständig kompatibel. Eine neue Bootstrap-CSS/JS-Datei wird erstellt und automatisch mit dem Dokument verknüpft.

Möchten Sie fortfahren?

Aus dieser Meldung werde ich nicht schlau, denn im Projekt wird in "bootstrap.css" angezeigt, es sei die Version  v3.3.7.

Wenn ich die obige Frage mit "Ja" beantworte, kommt eine zweite Meldung:

Es war nicht möglich, dieser Datei erforderliche Hyperlinks hinzuzufügen, da sich das Tag <head> in einem gesperrten Bereich befindet. Um diesen Inhalt einzufügen, müssen Sie die Vorlagendate '/Templates/templatename.dwt' öffnen und entweder das Tag <head> entsperren oder diesen Inhalt der Vorlage hinzufügen.

Es trifft zu, dass ich den head-Bereich nicht als bearbeitbaren Bereich definiert habe in der Vorlage - das wäre sicher einfach zu ändern, aber das Ganze irritiert mich doch.

Wer weiss da weiter?

Danke!

PizzaPasta

    This topic has been closed for replies.
    Correct answer Nancy OShea

    Oh, sorry!

    This is the code (without style-css). I hope it will be that what you need:

    <!DOCTYPE html>

    <html lang="de">

      <head>

        <meta charset="utf-8">

        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- TemplateBeginEditable name="doctitle" -->

        <title>Graphologie - Seitentitel</title>

        <!-- TemplateEndEditable -->

        <!-- Bootstrap -->

       

        <link href="../css/bootstrap-3.3.7.css" rel="stylesheet" type="text/css">

        <link href="../css/grapho_styles.css" rel="stylesheet" type="text/css">   

        <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->

        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->

        <!--[if lt IE 9]>

              <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>

              <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

            <![endif]-->

            <!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->

        <script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/muli:n3:default.js" type="text/javascript"></script>

      </head>

    <body>

      <div class="container">

      <nav class="row">

          <nav class="navbar navbar-default" role="navigation">

             <div class="container-fluid">

             <!--Brand and toggle get grouped for better mobile display-->

             <div class="navbar-header">

                     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#defaultNavbar1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>   

             </div><!--end navbar-header-->

             <!-- Collect the nav links, forms, and other content for toggling -->

            <div class="collapse navbar-collapse" id="defaultNavbar1">

                <ul class="nav navbar-nav">

                    <li class="active"><a href="#">HOME<span class="sr-only">(current)</span></a></li>

                     <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">KUNDEN<span class="caret"></span></a>

                    <ul class="dropdown-menu">

                      <li><a href="#">Link</a></li>

                      <li role="separator" class="divider"></li>

                      <li><a href="#">F</a></li>

                      <li><a href="#">P</a></li>

                      <li><a href="#">S</a></li>

                    </ul>

                  </li>

                  <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">ANGEBOT<span class="caret"></span></a>

                    <ul class="dropdown-menu">

                      <li><a href="#">Link</a></li>

                      <li role="separator" class="divider"></li>

                      <li><a href="#">M</a></li>

                      <li><a href="#">G</a></li>

                      <li><a href="#">About</a></li>

                    </ul>

                  </li>

                  <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">GRAPHOLOGIE<span class="caret"></span></a>

                    <ul class="dropdown-menu">

                      <li><a href="#">Link</a></li>

                      <li role="separator" class="divider"></li>

                      <li><a href="#">B</a></li>

                      <li><a href="#">W</a></li>

                      <li><a href="#">M</a></li>

                    </ul>

                  </li>

                </ul>

                <ul class="nav navbar-nav navbar-right">

                    <li><a href="#">AGB</a></li>

                    <li><a href="#">KONTAKT</a></li>

                </ul>

            </div><!--end defaultNavbar1-->       

                    

             </div><!--end container-fluid-->       

          </nav><!--end nav186-->     

      </nav><!--end nav185-->     

     

      <header class="row">

          <div class="col-sm-2 hidden-xs"><img src="../images/logo_150.jpg" alt="Logo Diamant" width="115" height="115" class="img-responsive"/> </div><!--end logo-->

        <div class="title col-sm-5">GRAPHOLOGIE</div><!--end title-->

        <div class="col-sm-5 hidden-xs">

        <form class="navbar-form navbar-right" role="search">

                <div class="form-group">

                  <input type="text" class="form-control" placeholder="Suchbegriff">

                </div>

                <button type="submit" class="btn btn-default">Finden</button>

              </form>

        </div>     

      </header>

      <!-- TemplateBeginEditable name="MainContent" -->

      <main>

        <div class="row">

          <ol class="breadcrumb">

            <li><a href="../index.html">Home</a></li>

            <li><a href="#">Library</a></li>

            <li class="active">Data</li>

          </ol>

        </div>

        <!--end breadcrumbs-->

        <div class="row">

          <aside class="col-sm-7 left_article"> ASIDE LINKER TEIL </aside>

          <aside class="col-sm-5 right_article"> ASIDE RECHTER TEIL </aside>

        </div>

        <!--end row aside-->

        <hr>

        <h2 class="text-center">SEITENTITEL</h2>

        <hr>

        <article class="col-sm-12">

          <div class="row text-center"> ERSTES DIV

         

          </div>

          <!--end erste row text-center-->

          <div class="row text-center"> ZWEITES DIV </div>

          <!--end zweite row text-center-->

          <hr>

          <h2 class="text-center">WEITERE INFORMATIONEN</h2>

          <hr>

          <div class="row">

            <div class="col-md-6">

              <div class="media-object-default">

                <div class="media">

                  <div class="media-left"><a href="#"> <img class="media-object" src="../images/100X125.gif" alt="placeholder image"></a> </div>

                  <div class="media-body">

                    <h4 class="media-heading"><a href="#">G</a></h4>

                    <p>Content</p>

                  </div>

                  <!--end media-body-->

                </div>

                <!--end media-->

                <div class="media">

                  <div class="media-left"><a href="#"> <img class="media-object" src="../images/100X125.gif" alt="placeholder image"></a> </div>

                  <div class="media-body">

                    <h4 class="media-heading"><a href="#">About</a></h4>

                    <p>Content</p>

                  </div>

                  <!--end media-body-->

                </div>

                <!--end media-->

              </div>

              <!--end media-object-default-->

            </div>

          

            <div class="col-md-6">

              <div class="media-object-default">

                <div class="media">

                  <div class="media-left"><a href="#"> <img class="media-object" src="../images/100X125.gif" alt="placeholder image"></a> </div>

                  <div class="media-body">

                    <h4 class="media-heading"><a href="#">FAQ</a></h4>

                    <p>Content</p>

                  </div>

                  <!--end media-body-->

                </div>

                <!--end media-->

                <div class="media">

                  <div class="media-left"><a href="#"> <img class="media-object" src="../images/100X125.gif" alt="placeholder image"></a> </div>

                  <div class="media-body">

                    <h4 class="media-heading"><a href="#">A</a></h4>

                    <p>Content</p>

                  </div>

                  <!--end media-body-->

                </div>

                <!--end media-->

              </div>

              <!--end media-object-default-->

            </div>

          </div>

          <!--end row featured products-->

          <hr>

        </article>

        <aside class="well col-sm-12">

          <div class="row">

            <div class="col-xs-12 col-md-7 col-lg-7">

              <!--beginn Linkgruppe-->

              <div class="row">

                <div class="col-sm-4 col-xs-6">

                  <div>

                    <ul class="list-unstyled">

                      <li> <a>U</a></li>

                      <li> <a>P</a></li>

                      <li> <a>S</a></li>

                      <li> <a>  </a></li>

                      <li> <a>G</a></li>

                    </ul>

                  </div>

                </div>

                <!--end 1. Gruppe-->

                <div class="col-sm-4 col-xs-6">

                  <div>

                    <ul class="list-unstyled">

                      <li> <a>G</a></li>

                      <li> <a>S</a></li>

                      <li> <a>J</a></li>

                      <li> <a>  </a></li>

                      <li> <a>E</a></li>

                    </ul>

                  </div>

                </div>

                <!--end 2. Gruppe-->

                <div class="col-sm-4 col-xs-6">

                  <div>

                    <ul class="list-unstyled">

                      <li> <a>G</a></li>

                      <li> <a>H</a></li>

                      <li> <a>Ü</a></li>

                      <li> <a>  </a></li>

                      <li> <a>AGB</a></li>

                    </ul>

                  </div>

                </div>

                <!--end 3. Gruppe-->

              </div>

              <!--end row Linkgruppe in well-->

            </div>

            <!--end div Linkgruppe-->

            <div class="col-xs-6 col-md-5">

               <address>

                        <strong>Name</strong><br>

                        <strong></strong><br>

                        <br>

                   </address>

                      <address>

                        <strong>E-Mail:</strong><br>

                                      

              </address>

            </div>

            <!--end address-->

          </div>

          <!--end row well-->

        </aside>

      </main>

      <!-- TemplateEndEditable -->

      <footer class="col-sm-12">

          <div class="row">

              <div class="col-sm-4">&copy; 2007-2017 <a href="#"></a></div>

              <div class="col-sm-4">Aktualisiert am 20.April 2017</div>

              <div class="col-sm-4"><a href="#">Impressum</a></div>

          </div>

      </footer>

      </div><!--end container-->

     

      <!-- TemplateBeginEditable name="JavaScripts" -->

     

        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->

        <script src="../js/jquery-1.11.3.min.js"></script>

        <!-- Include all compiled plugins (below), or include individual files as needed -->

        <!-- <script src="../js/bootstrap.js"></script> -->

      <script src="../js/bootstrap-3.3.7.js"></script>

    <!-- TemplateEndEditable -->

      </body>

    </html>


    The reason it won't work is because your Template is not properly formed.  The <head> tag is not editable.

    <!doctype html>

    <html>

    <head>

    <meta charset="utf-8">

    <!-- TemplateBeginEditable name="doctitle" -->

    <title>Untitled Document</title>

    <!-- TemplateEndEditable -->

    <!-- TemplateBeginEditable name="head" -->

    <!-- TemplateEndEditable -->

    </head>

    <body>

    <!-- TemplateBeginEditable name="main" -->

    <h1>Heading 1</h1>

    <p>Page specific content.</p>

    <h2>Heading 2</h2>

    <p>Page specific content</p>

    <!-- TemplateEndEditable -->

    </body>

    </html>

    1 reply

    pziecina
    pziecina
    Legend
    May 5, 2017

    Please check that you do not have the same problem as in this discussion -

    https://forums.adobe.com/thread/2310092

    P
    PizzaPastaAuthor
    Inspiring
    May 7, 2017

    Danke pziecina - leider nein!

    Natürlich suche ich bei Fragen und Problemen zuerst im Forum nach Antworten - eine grossartige Möglichkeit, danke!

    Aber der erwähnte Thread hat mir nicht geholfen.

    Was ich gemacht habe: Ich habe die Datei "bootstrap.css" ersetzt durch "bootstrap-3.3.7.css", weil das ja die aktuellere ist.

    Aber dann begannen die Probleme erst recht:

    Jetzt ging gar nichts mehr, wenn ich eine Bootstrap-Komponente einfügen wollte.

    Nicht einmal einen container konnte ich über die "Einfügen-Palette" einfügen.

    Dann habe ich "bootstrap.css" wieder eingefügt, hatte dann also zwei Versionen von bootstrap.css im head.

    Aus unerfindlichen Gründen hat's dann wieder funktioniert. - Für mich ein Rätsel.

    Das war der Moment, wo ich meine Frage gepostet habe.

    Schliesslich habe ich den Computer heruntergefahren und neu gestartet.

    Dann konnte ich die ältere Bootstrap-Datei entfernen und nun funktioniert wieder alles, wie es sollte. Ich habe nur noch die neue Version bootstrap-3.3.7.css im head.

    Das Problem ist also gelöst, aber ich kenne die Ursache nicht.

    Eigentlich meine ich, dass bei DW CC2017 jeweils die aktuellste Version von bootstrap "eingebaut" ist und dass darum die Meldung "...veraltete Version..." nicht erscheinen sollte.

    Danke für die Unterstützung - und vielleicht löst sich das Rätsel doch noch?

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    May 8, 2017

    Open your Template.dwt file to add Bootstrap components.

    Nancy

    Nancy O'Shea— Product User & Community Expert
    Firefly Community Gallery
    Adobe Firefly

    Remix with Firefly Community Gallery

    Thousands of free creations to fall in love with and remix in Firefly.

    Explore now
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices