Docs

[AK49 Logan 907]

Hi, I haven’t touched the customizer in a while and I forgot how to do some things. Just need a bit of guidance. Thanks!

1. How to change image one’s text to white?
Raw content: “<p class=”man”>See what we are up to! Whether we are racing or building a Trophy Truck we have a lot to share.</p>”

2. How can I change the background color on the left side of the screen like I did on the right? Also changing the text color under the “Recent Post” title? In the second image below.

3. Howe to change the white background in the gallery page to the same grey I have been using? Third image.

4. How to make the image on the top and bottom of this page: http://jumpoffroad.us/about-2/ scroll like http://vimandvigor.co.za/about/

Thanks for your time and help! (Ps. I changed the text to red so I can see it.)
Website: http://jumpoffroad.us/

[Christian]

1. Add color: white to the Style field of the Raw Element

2. Please add the code below in your Appearance > Customize > Custom > CSS

/* Left Side BG */
.x-container.main:before {
    background-color: red;
}
/* Post Title Color */
h2.entry-title a {
    color: blue;
}

3. Howe to change the white background in the gallery page to the same grey I have been using? Third image.

.page-id-119 .site {
    background-color: rgb(39,39,39);
 }

4. How to make the image on the top and bottom of this page: http://jumpoffroad.us/about-2/ scroll like http://vimandvigor.co.za/about/

Enable Parallax option in your Section (see attachment).

Hope the helps. 🙂

[AK49 Logan 907]

Thanks for the quick response. Some issues though.

1. Int he image 1 below is shows the titles are “missing” because they are white. I would like them to be grey (39, 39, 39) on the home page. But they need to stay white on the news page how they are now. Marked in blue.

2. How to change the recent post text color to white marked in red? http://jumpoffroad.us/news/

3. How to change the color of the text in the gallery title bar to black without changing it on the rest of the site? It’s white right now? http://jumpoffroad.us/case-studies/

4. How to change the categories text color without changing it on the rest of the site? Marked in green.

5. To continue on the paralax. I’m a little confused because that was created with the rev slider. should I just erase that and change it to the “Image” element? then enable parallax through there with cornerstone?

Thanks again!

[Christian]

1. Please add the code below in your Appearance > Customize > Custom > CSS.

.x-recent-posts .h-recent-posts, .x-recent-posts .x-recent-posts-date {
    color: rgb(39,39,39);
}

2. `.x-sidebar .h-widget,.x-sidebar .widget, .x-sidebar .widget a, .x-sidebar .widget ul li a, .x-sidebar .widget ol li a, .x-sidebar .widget_tag_cloud .tagcloud a, .x-sidebar .widget_product_tag_cloud .tagcloud a, .x-sidebar .widget a:hover, .x-sidebar .widget ul li a:hover, .x-sidebar .widget ol li a:hover, .x-sidebar .widget_tag_cloud .tagcloud a:hover, .x-sidebar .widget_product_tag_cloud .tagcloud a:hover, .x-sidebar .widget_shopping_cart .buttons .button, .x-sidebar .widget_price_filter .price_slider_amount .button {
color: white !important;
}
.x-sidebar .h-widget {
border-color: white !important;
}`

3. `.page-id-119 .option-set .x-index-filter-label, .page-id-119 .option-set .x-portfolio-filter-label {
color: black;
}`

4. `.page-id-119 .option-set .x-index-filter-label, .page-id-119 .option-set .x-portfolio-filter-label {
color: black;
}

.page-id-119 .option-set .x-portfolio-filters-menu > li > a {
color: white;
}

.page-id-119 .option-set .x-portfolio-filters-menu > li > a:hover {
color: green;
}`

5. http://vimandvigor.co.za/about/ uses Cornerstone Section Parallax option so if you need to replicate that, you’ll need to use an image.

Alternatively, Slider Revolution also has a parallax feature. Please see https://www.themepunch.com/revslider-doc/parallax-3d/

Thanks.

[AK49 Logan 907]

1. I think there are arrows on the white box. But you can’t see them with the reverse color scheme. Can we invert the arrows back to black? First image.

2. With the paralax I erased the top section and put a new one and used the image then enabled paralax. But the image is short. How can I make it to the size I want? Second image.

3. There are slash marks that should be white and I think there is a drop down arrow next to filter category that is white. Can we fix that? There’s a border for it but it’s white so it won’t show. We just need to make it black. Third image.

4. How to remove the image before the beginning video on the home page? Trying to get it like this. Besides the 4 bars that come up. http://theme.co/x/demo/integrity/1/

5. How to change the link and color of the “More about us” button on the main page connected to the video in slider revolution?

Thanks again for all the help it’s been incredibly helpful. 🙂

[Rue Nel]

Hello There,

Thanks for the updates!

1] To change the color of the arrows, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.entry-top-navigation a,
.x-nav-articles a {
    color: #000 !important;
}

2] Please edit your page and add a gap element. Let the gap element control the height of the section.

3] To change the colors of the slash in your portfolio page, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.option-set .x-index-filters-menu>li>a, 
.option-set .x-index-filters-menu>li:after, 
.option-set .x-portfolio-filters-menu>li>a, 
.option-set .x-portfolio-filters-menu>li:after {
    color: #fff;
}

4] Please edit your slider and remove the background image.
http://prntscr.com/blivbo

5] To change the link and color, please edit your slider and click on the “More About Us” layer. Please see the screenshot: http://prntscr.com/blivyj

Hope this helps.

[AK49 Logan 907]

Hello again! Thanks for all the tips! How do you know what code does what? And how do oyu get the code so fast? Do you know how to code and are doing this all in your head then doing a quick test or do you have a database of code to help you also?

2. How can I raise the image so the truck is in the center? Or so I need to reformat the picture size in Photoshop?

3. The slash marks changed but the thin white border around the category box that needs to be changed to black.

4. The image you shows only is the read only code and is not possible to erase. Under source it shows I can change the image but I see no way to be able to not use an image. Help? 🙂

5. I enabled the color option and changed it but the button stays orange. Any ideas why?

6. How to change the bottom arrows in the gallery to green.? Last image.

Side note, I updated some profile settings and my image changed and I can’t seem to find where to change it back?

Thanks again for all the dedicated support!

[Christopher]

Hi there,

You can inspect elements with chrome developers tools to find selectors.

#2 Increase gap element size to 250px.

#3

.option-set .x-index-filter-label, .option-set .x-portfolio-filter-label {
    background-color: #272727;
}

a.x-portfolio-filters.cf {
    background-color: #272727 !important;
    border-color: #272727;
    color: #fff !important;
}
.option-set .x-index-filters i, .option-set .x-portfolio-filters i {
    background-color: #272727;
}
 .option-set .x-portfolio-filters i {
    border-color:#272727;
}

#4 Adding poster image in necessary when you set background video, otherwise the slider settings won’t be saved.

#5 Please add style="color:red;" attribute to <a> tag.

#6

a.prev-next.hidden-phone {
    color: hsl(130,100%,50%);
}

Hope it helps.

[AK49 Logan 907]

Hi, thanks for the updates!

2. Can you explain what you mean? Trying to adjust the placement of the image in the parallax. 🙂

3.Your code didn’t really work. It changed it to the first image below while the second image is the current. Just trying to change the color of the drop down arrow to black from the current state of white. Highlighted in green box.

4. If the poster image is absolutely necessary how do you guys create the one like the integrity one demo? http://theme.co/x/demo/integrity/1/

5. Can you show me how to place it or an example image please. 🙂

6. Can we also add the green to the page numbers? Last image.

7. how to change my profile image on this site lol?

Thanks again you guys are so helpful and have taught me so much!

[Friech]

Hi There,

#2 You mean the truck on the “Our Primary Expertise” section, right? Please add this on Custom > CSS in the Customizer.

.home #x-section-2 {
	background-position-y: 50% !important;
}

#3 Look for this custom css below on your customizer and change the color value to white, this is because if the text “Filter by category” remains black on a black background it would not be visible.

.page-id-119 .option-set .x-index-filter-label, .page-id-119 .option-set .x-portfolio-filter-label {
    color: black;
}

And then add this on your custom css in customizer

.x-portfolio-filters .x-portfolio-filter-label,
.option-set .x-portfolio-filters .x-icon-chevron-down  {
	background-color: #272727;
}
.option-set .x-portfolio-filters,
.option-set .x-portfolio-filters .x-icon-chevron-down {
	border-color: #272727;
}
.option-set .x-portfolio-filters:hover i {
	color: #000;
}

#4 The video on that demo page is not added as a layer of Slider, instead it is added as a Optional Background Video for a slider that is set on the SLIDER ABOVE MASTHEAD feature. Please follow this post for more info above feature slider.

#5 Here’s an example

<a style="color: red;white-space: nowrap;" class="x-btn x-btn-square x-btn-large" href="//theme.co/x/demo/expanded/agency/case-studies/">More About Us</a>

#6 Add this on your custom CSS

.x-pagination span.dots,
.x-pagination span.current,
.x-pagination a:hover,
.x-pagination a,
.x-pagination span {
  color: #00ff2b;
}

#7 Set your email avatar on https://en.gravatar.com/

Hope it helps, Cheers!

[Author]

Posts