quick question here:
I am using DCE on Typo 6.1.5. I am trying to set an element out of the "container" div. But it rarely works.
<div id="contentMarginFix">..</div>
<div id="contact">
<div class="container">
<div class="gmaps">
</div>
</div>
</div>
I want to get the "gmaps" div in the "contact" div. Not in the "container" one.
Here is the DCE Template
http://gyazo.com/2c0a13746cdd834ebdb86a0b64fd10b1.png
And here is the template for the page
http://i.imgur.com/y2rwP6P.jpg
I was trying for two hours now maybe i just don't see it but i appreciate your help very much!
From the screenshots you provided I'd say it's possible the layout template is in the wrong place. Make sure the contact.html you use as a layout is in the right place.
If this is a basic fluid template directly in typo3 make sure the file is in the place you defined in your setup typoscript. Default would be something like this:
layoutRootPath = fileadmin/templates/Layouts/
If this is inside an extension the correct place for the layout template is
Resources\Private\Layouts
Be aware that in more recent extbase versions the naming conventions are more strict and require a capital first letter for the html files (so Contact.html)
Related
I'm trying to build a basic documentation site using asciidoctor. One thing I am struggling with is how I can inject a standard site header (a banner with a logo and top-level navigation) into each documentation page.
I render my asciidoc directly to html from the command line. I have tried to find a way to somehow inject an extra div element and position it fixed at the top, but I can't figure out what mechanism to use for this. My early attempts involved using docinfo.html but that gets injected into the html in the <head> element, instead of the <body>.
I am aware that full-on publication systems like Jekyll allow me to configure "front matter" that can probably take care of this, but I was hoping there was a mechanism or trick using vanilla asciidoctor that can achieve this.
Ted Bergeron on the Mailing List mentioned a simple project:
Demo website created just using Asciidoctor.
Check the corresponding repo to see the files and how to create the site (just using one command).
In summary: simply create a header asciidoc file that includes your site nav (in the demo site this is done using table markup), without including a level-0 (document) title. Include this header file right at the top in every page of your site. Then render by just running asciidoctor *.txt on your project.
--embedded option + simple post processing
With this option, asciidoctor generates only the interior part of the <body> element.
For example:
main.adoc
= Super title
== Second level
asdf
== Also second level
qwer
then:
asciidoctor --embedded main.adoc
produces:
main.html
<div class="sect1">
<h2 id="_second_level">Second level</h2>
<div class="sectionbody">
<div class="paragraph">
<p>asdf</p>
</div>
</div>
</div>
<div class="sect1">
<h2 id="_also_second_level">Also second level</h2>
<div class="sectionbody">
<div class="paragraph">
<p>qwer</p>
</div>
</div>
</div>
You can then just cat a header and closing footer, and you are done.
Tested with Asciidoctor 2.0.10.
I need some help here.
I found the "Miniport" template by "html5up" and I want to use this template as a base for my future projetc.
The demo can be seen here: http://html5up.net/miniport
On the demo we can see that bellow the website menu is an circular image and next to it is some texts. I need to know how to remove that image and center the texts so the texts can match the rest of the template (the site has the divs centered too).
I dont have much skills on css nor html5. Im a fan and I want to learn.
If anybode can help me, please..
Sorry about my english.
I too am using this template.
In order to remove the image, open the html document.
Delete this code that is found between ~line 42—46: (this is what formats and holds your image)
<article class="container" id="top">
<div class="row">
<div class="4u">
<span class="image fit"><img src="images/angela.jpg" alt="" width="118%" height="350" /></span>
</div>
Reformat the div tag:
<div class="8u"> to <div class="container" align="center">
By doing this, you are modifying the style within the html document rather than the css doc. This is good since you do not want to change every div tag in the html doc, just this one. Additionally, adding align="center" helps override most css formatting within your divs. You can use that trick later on in your site.
On a side note, double check that you like the command the contact form uses. I do not, since it opens up my computer's email app rather than directly sending the email through the webpage. That's my next project.
Enjoy!
So for my question you can refer to udacity.com main page.
Im trying to access this text -"The Udacity Difference" somewhere on the middle of the page.
I tried this :
d3.select("div.banner-content.h2.h-slim")
d3.select("div.banner-content.h-slim")
None of the above is working. So I tried looking in dev-tools element section for this page.
Then I could hover and see that :
div.banner-content has further
{div.container
{div.row
{div.col-xs-12 text-center
{h2.h-slim}}}}
Then I thought ok I shoud try if I can get the "container" atleast, but then even this
d3.select("div.banner-content.div.container")
OR
d3.select("div.banner-content.container")
doesnt work !!!!
Wheres the fault in logic ?
You can find nested elements using d3's chained syntax as shown below.
HTML:
<div class="banner-content">
<div class="container">
<h2 class="h-slim">Header</h2>
</div>
</div>
Code:
d3.select("div.banner-content").select("div.container").select("h2.h-slim")
EDIT: No need to type such long syntax. Just need to separate the selectors using a space.
d3.select("div.banner-content div.container h2.h-slim")
Code below will also give you the same results in this case. You can specifically add tags if necessary.
d3.select("div.banner-content .container .h-slim")
So I was wondering if anyone knows of a package/plugin for sublime or a service that lists class attributes within an HTML snippet.
For example I like to markup then work on the css. I keep finding myself splitting sublime into two halves and just manually scrolling through the HTML on the left and rewriting the the actual class name styles on the right.
Basically I have:
<section class="home-testimonials">
<h2 class="home-title">
<span>Testimonials</span>
</h2>
<div class="testimonial-wrapper">
<!-- Other divs with classes -->
</div>
</section>
And I want a list like this:
.home-testimonials
.home-title
.testimonial-wrapper
If it denotes hierarchy position even better. Thanks in advance!
I'm not sure about Sublime, but with regular JS you can select all elements with document.getElementsByTagName('*'), and then extract classes for each element with element.className.
I am trying to transfer my simple website to joomla. I like the design and style I did in html5/css3, but I think that the content management is something that I could take advantage of. I have my design, so I decided to give templates a go.
I understand how on the templateDetails.xml you defined the locations:
<positions>
<position>breadcrumb</position>
<position>right</position>
<position>top</position>
<position>footer</position>
</positions>
But I don't understand how can I create a new position. For example if I wanted to create a position on the bottom right below the main content or even more specific where should this information go? I see this are the default positions http://docs.joomla.org/Module_Map.
The idea I have right now is to do my template with all the div tags, that I already have but just erase the content and then in the content create a a div tag where I put
<div id="content" class="float"> <jdoc:include type="component" /></div>
But then I don't think I am really taking advantage of joomla.
Or whats a better way to move a html/css3 website to joomla without having to use a template (I have not liked any 100%).
If I understand your question right <jdoc:include type="modules" name="bottom_right" style="xhtml" /> will allow you to add the position to the index.php of your template. Then you can assign a module at the backend. Don't forget to add <position>bottom_right</position> to the XML of your template.
If you need to clarify anything please raise your question here