Jump to content

garretblake

Members
  • Content count

    16
  • Joined

  • Last visited

About garretblake

  • Rank
    Forum Newcomer
  1. Hi, I am creating a carousel with bootstrap and want the images to be full width. there are some text that is beeing loadded to the carousel and this one I would like to be in a specific place. Perhaps its easier to explain with images. what I want to do: the grey box it should be a full width image for the code I have the following: <?php /** * The template for displaying all pages * * This is the template that displays all pages by default. * Please note that this is the WordPress construct of pages * and that other 'pages' on your WordPress site may use a * different template. * * @[member="link"] https://codex.wordpress.org/Template_Hierarchy * * @package bootstrapwp */ get_header(); ?> <div id="primary" class="content-area"> <main id="main" class="site-main" role="main"> <!--BOOTSTRAP CAROUSEL START--> <div id="carousel-wrapper" class="container-fluid"> <!-- Indicators --> <div id="carousel-home" class="carousel slide" data-ride="carousel"> <div class="row"> <!-- Indicators --> <ol class="carousel-indicators"> <li data-target="#carousel-home" data-slide-to="0" class="active"></li> <li data-target="#carousel-home" data-slide-to="1"></li> <li data-target="#carousel-home" data-slide-to="2"></li> </ol> <!-- Wrapper for slides --> <div class="carousel-inner" role="listbox"> <?php $slider = get_posts(array('post_type' => 'slider', 'posts_per_page' => 3)); ?> <?php $count = 0; ?> <?php foreach ($slider as $slide): ?> <div class="carousel-item <?php echo ($count == 0) ? 'active' : ''; ?>"> <img src="<?php echo wp_get_attachment_url(get_post_thumbnail_id($slide->ID)) ?>" class="d-block img-fluid" alt="Responsive image"/> <div id="carousel-comment-box" class="container" ><?php echo $slide->post_content; ?></div> </div> <?php $count++; ?> <?php endforeach; ?> </div> </div> <!--BOOTSTRAP CAROUSEL END--> </div><!--Row END--> </div><!--Container-fluid END--> </main><!-- #main --> </div><!-- #primary --> <?php get_footer(); the CSS // BOOTSTRAP CAROUSEL START// // Carousel global START // #carousel-wrapper { padding:0 ! important; position: relative; } #carousel-home { position: relative; height: auto; } .carousel-inner img { padding: 0; height: 300px; } // Carousel global END // // Carousel Comment box START // #carousel-comment-box { position:absolute; // Padding top right bottom left // padding: 30px 0px 30px 0px; // Font// color: $color__dark; list-style-type: none; font-family: $font-family-serif; font-style: italic; font-weight:700; font-size: 1.8em; line-height: 1.4em; @[member="Include"] media-breakpoint-up(sm) { @[member="Include"] make-col(4); @[member="Include"] make-col-offset(; display: inline-block; vertical-align: top; } @[member="Include"] media-breakpoint-down(sm) { @[member="Include"] make-col(12); } } // Carousel Comment box END // the rest of the layout is made with the normal container and I would like the text box to align with the rest. Now it takes as a reference the end of the viewport and not like the container class from bootstrap usually reacts. is there any good idea on how to do this? perhaps its something simple thank you in advance
  2. bootstrap and underscore

    Hi everyone, I have one question. I have installed the theme underscores.me to wordpress and now to design the look of the website i would like to connect bootstrap v4 with underscores. does anyone know and can help me pointing it out the best way of doing it? thank you in advance!
  3. templates and Expression engine

    Hi, Thank you very much for your reply. Talking about CMS do you think EE is a good one compared with Word Press for example that has already so many templates available? Thank you again, Best regards
  4. Hi Everyone, I would like to know where can I find some templates with different design options for Expression Engine. it seems that there isn't to choose from out there. Also if its possible to have other templates ( for example for wordpress ) and have them installed at EE. and if yes, how can it be installed. I not a web developer and my knowledge of web design is limited so I was looking for an easier option to install a good template with a nice structure and tweak here and there. Thank you very much in advance, Best regards, Luis
  5. highlighted div

    Hi everyone. I'm trying for a while to make a div with a title and a list that is highlighted with rollover. I've made a graphic to exemplify what I'm trying to make. I have tried to use the BigTarget.js and the fitted.js without any luck. Can anyone help me on this please? Thanks
  6. Load an random external HTML into a Div

    thanks. I'll check this page. I'm not really a programmer, but maybe with this example I can manage to make the thing I'm searching for. An adventure is excepting me I guess..thanks zed
  7. Load an random external HTML into a Div

    Hi people, I would like to make the following thing: Load a random file, from a xml list, into a div. I've made a scheme where I show what I was trying to make, but I don't know how to make it. I would like to load into a div a random HTML file, loaded from a XML. Does anyone knows an similar example or can tell me how's possible to do this, please? is it better to do with Javascript ? thanks for the attention guys
  8. load a random html into a div

    That's right, I want to load a random html file from a list into a another div. Does anyone knows any example, please? It would be very helpful. Thanks
  9. errorPlacement

    Hi guys. I'm trying to make a contact form with the Jquery validation plugin. I was wondering how can I specify the error message ( for example the name error ) to insert after a label. I have this code: $(document).ready(function(){ $("#form").validate({ rules: { name: "required", email: { required: true, email: true }, subject: "required", message: "required" }, messages: { name: "write your name!", email: { required: "write your email address!", email: "Invalid email address. Try again!", }, subject: "write a subject!", message: "write your message!", }, errorPlacement: function(error, element) { error.insertAfter("#name_label") } }) }); I can make the error's go to the place i want, after the label I name, but I wanted to specify and put the each error in the respective label. Does anyone can tell me how can I do this please? ahh, and other question. Can i make, after having all fields validated and the mail sent, a image to appear on a div, by changing one image for another? Thanks
  10. change visited color

    thanks. The hover was behind the visited in the css file. thanks
  11. change visited color

    Ok. I'm sure that this is a really simple question but I'm not being able to do this. I have a link styled with css. I've made the link change when rollover and when visited. After the link is visited it stays always with that color. I would like to know how can I change the color link on rollover, even after being visited. Thanks
  12. Problem with my web

    Hi guys. I've a problem here with my new web I'm trying to make. It's the first time I work with html / css / javascript. So the problem I've here is that the page works relatively well in firefox ( needs some work yet ) but doesn't work in Internet Explorer / safari / Opera :S The javascripts animations, none works except in firefox. Does anyone can help me here please. Here's the link to my page Thanks in advance ( The page is not finished yet. It's being a long process but slowly I hope to get there )
  13. different layouts

    Hi guys. Can someone give me an opinion. I want to make a gallery with images but not all the images have the same format. So, i can have only an image on the scene or two or three, depending of the size. I would like to make a image gallery with different layouts, made with divs. How can I do this? any opinions? thanks in advance
  14. Slidepanel with Jquery Doubt

    hi there guys. I was making some test's here with jquery, wanting to make a slideup panel on mouseenter and mouseleave. It's the first time I'm working with javascript, so I don't know nothing about it. The panel is already sliding down (and i wanted ti slide up) at rollover. but I don't know how to do rollout. can someone help me to do a rollover and rollout and to make the panel slide to the right direction, please? <!DOCTYPE HTML> <html> <head> <title></title> <style type="text/css"> #div_01 { height: 215px; width: 200px; } #div_01 a { height: 215px; width: 200px; background-color: #900; display: block; } #div_02 { height: 185px; width: 170px; background-color: #3F0; padding: 15px; display: none; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> jQuery(function( $ ){ var div_02 = $( "#div_02" ); $( "a" ).mouseover( function( event ){ event.preventDefault(); if (div_02.is( ":visible" )){ div_02.slideUp( 500 ); } else { div_02.slideDown( 500 ); } } ); }); </script> </head> <body> <div id="div_01"> <a href="#"></a> <div id="div_02"> </div> </div> </body> </html> thanks in advance
  15. Need some opinion

    Hi guys. Need some opinion here. I'm making my portfolio online and I'm stuck with an issue about design/code...so the question is that I have some images to show of my projects. They don't have always the same width, they can change depending of what I want to show. So the question is how I do this. Flash or HTML, I saw some sideshow like "simple viewer" or "slideshowpro". I add a small picture just to show a sketch of the possible compositions. Any suggestions are welcome. Click image for larger version Name: opinion.jpg Views: 1 Size: 34.8 KB ID: 4454 thanks all,
×