Home>Support>Making Vantage theme exactly like wanted design

Making Vantage theme exactly like wanted design

By Ivan Bagarić, 9 years ago. Last reply by Magus, 9 years ago.

I made a design (http://genos.uk.tempcloudsite.com/wp-content/themes/vantage-child/images/index_4.jpg), my customer wanted web page in WP, first time using WP and I’d like some advice. Is it possible to make an identical design with Vantage Premium theme?
Temp site: http://genos.uk.tempcloudsite.com/

I made a folder vantage-child in which I put: style.css and function.css, also I put the header.php and footer.php because I had to add one div.

function.php

<?php
	add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
	function theme_enqueue_styles() {
	    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
	    wp_enqueue_style( 'child-style',
	        get_stylesheet_directory_uri() . '/style.css',
	        array('parent-style')
	    );
	}
?>

I do not need the part below the H1 tag, is it better to use CSS do not show this part, or to override html?

<h1>About Us</h1>		
<div class="decoration"><div class="decoration-inside"></div></div>		
<h3></h3>

I wish that every line below main menu has other colors, but that does not pass ?!

.main-navigation ul li .page-item-27 a{border-color: red;}
.main-navigation ul li .page-item-2 a{border-color: yellow;}
.main-navigation ul li .page-item-23 a{border-color: blue;}
.main-navigation ul li .page-item-6 a{border-color: green;}

Why always automatically add padding to the PGC-46-0-0, how best to affect the appearance of the div? Should i use custom css in admin area

 <div id="pgc-46-0-0" class="panel-grid-cell">

What is the best plugin for it and how to display sections: News, Project, Selected publiaction.

Private Snippet

Tnx!

URL: http://genos.uk.tempcloudsite.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 5 months ago Andrew Misplon
    Hi, I Work Here

    Hi Ivan

    Thanks for reaching out. Good luck on your WordPress journey. A lot of what you want to change could be done using CSS alone. If you have CSS experience that would be helpful. Let me try run through each point.

    * Your child theme looks good.

    * The decoration div is added by the Vantage Headline widget. Changing widgets isn’t as easy as filtering other parts of the theme. Hiding this with CSS would be the easiest.

    /* Headline Widget */

.widget_headline-widget .decoration {
display: none;
}

    We also have a more customisable Headline widget as part of our Widgets Bundle plugin, keep that in mind if you haven’t yet checked it out: http://wordpress.org/plugins/so-widgets-bundle/.

    * Borders: This is what you’ll need. Edit and repeat for your other items:

    .main-navigation ul li.menu-item-47 a {
border-bottom: 2px solid red;
}

    * PGC-46-0-0 is part of Page Builder’s output. You can either overide it using the row controls as you have done OR you can use the following CSS:

    .panel-row-style { padding: 0 !important; }

    OR you could click Attributes tab in the row settings, top right and add your own class to the row, eg:

    no-row-padding

    Then in your CSS you could target as follows:

    .panel-row-style.no-row-padding { padding: 0 !important; }

    Up to you which way to go.

    In Page Builder you can use our Post Loop (PB) widget to output different post categories onto different pages. Lots of options there for outputting content.

    Hope that helps.

  2. 9 years, 5 months ago Ivan Bagarić

    hey,

    why is my images on Projects cuted to 150×122. I upload photo to exactly dimension and loops are also fine?

    			<?php
			if ( has_post_thumbnail() ) {
				the_post_thumbnail( array(277, 122) );
			} 
			?>
  3. 9 years, 5 months ago Andrew Misplon
    Hi, I Work Here

    Hey Ivan

    They are set to 270 x 122 if you view the source. CSS is pushing them to 100%. Try the following to help:

    article.post .entry-header .entry-thumbnail img, article.page .entry-header .entry-thumbnail img {
  width: auto;
}
  4. 9 years, 5 months ago Ivan Bagarić

    Hey, I set it to 270 x 122 , this is whanted dimension, but in upload WP cut it to 150 x 122

  5. 9 years, 5 months ago Andrew Misplon
    Hi, I Work Here

    Are you referring to this page here?

    http://genos.uk.tempcloudsite.com/project/

    If I remove width: 100% using Custom CSS as mentioned above, the featured images are 270 x 122.

  6. 9 years, 4 months ago Ivan Bagarić

    no, Projects on front page.

  7. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Ivan

    The post loop uses thumbnails to display the images. Please navigate to Settings->Media and check the thumbnail size specified there. You can also check if the option to crop thumbnails is checked. Make any adjustments and save.

    Once done you will need to regenerate the existing thumbnails. Try this plugin

    https://wordpress.org/plugins/force-regenerate-thumbnails/

    Hope this helps

    Magus

  8. 9 years, 4 months ago Ivan Bagarić

    Thanks, man! that was the problem!

  9. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Ivan

    No problem, glad to hear its fixed.

    If you need any more help please feel free to open a new Support Thread.

    Magus

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More