Hello,

I would like to set the width of the content container to 77% instead of 1310px.

Firstly, I want the font to always scale with the screen size and container size and, secondly, that the screen size is optimally used.

Should I change the standard WordPress image sizes for this?
For example, a larger maximum image, etc.?
Are there any sample pages?
I had read somewhere that you can specify this in functions.php.
Do you have any tips on this?
That would be great.

Thank you in advance.

Hi,

I’m attempting to create a custom menu in the footer.

Where I’m stuck: I cannot get the font to resize or change the color of the link hover.

I’m using an html block in the layerslider, and have tried multiple ways to resize the font to 14px. I also want the link color before hover to be a different color than the normal site settings and the hover color to be different.

Here’s what I’ve tried with no success:
* inline html inside the layer slider interface
* classic head/style/body tags inside the html code block in the layer slider (what’s in there right now)
* css using my own class
* css using a copied selector
* changing the font size inside of the layer in the layer slider to the size I want

Help!
Below I provide the exact thing I’m trying to accomplish, the old site that we’re copying into your theme from a different one. Along with creds.

Also, can you kindly share how I can style icon colors? You can see the fb icon I started playing around with. I would like for it to appear as a different color to start, but especially for it to change color on hover.

I’ve tried:
* Adding a class to the icon inside the layer slider interface
* Using css to style the selector

Neither has yielded results. And I’m especially unclear about how to change the hover color for something like this.

Last but not least, I would like to drop a copyright line at the bottom of this area. I already have this js for is:
©<script type=”text/javascript”> copyright=new Date(); update=copyright.getFullYear(); document.write(“” + update + ” ” + ” “); </script> Mary Sise, LLC [nolink]
But I can’t seem to add any js to the layer slider interface. Can you give me a way to accomplish the above inside of the layer slider I’m creating as the footer “page”?

I had to design all of this in layer slider to get the responsive aspect I want with the background image.

I added javascript particles.js
https://vincentgarreau.com/particles.js/
I downloaded and extract in child theme, i added css code

/* —- base —- */
html{
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
canvas{
display:block;
vertical-align:bottom;
}
/* —- particles.js container —- */
#particles-js {
position:absolute;
width: 100%;
height: 100%;
background-image: url(”);
background-size: cover;
background-position: 50% 50%;
background-repeat: no-repeat;
top: 0;
}

/* =============================================================================
HTML5 CSS Reset Minified – Eric Meyer
========================================================================== */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
li{list-style:none}

/* =============================================================================
My CSS
========================================================================== */

/* —- base —- */

html,body{
width:100%;
height:100%;
background:#111;
}

html{
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body{
font:normal 75% Arial, Helvetica, sans-serif;
}

canvas{
display:block;
vertical-align:bottom;
}

/* —- stats.js —- */

.count-particles{
background: #000022;
position: absolute;
top: 48px;
left: 0;
width: 80px;
color: #13E8E9;
font-size: .8em;
text-align: left;
text-indent: 4px;
line-height: 14px;
padding-bottom: 2px;
font-family: Helvetica, Arial, sans-serif;
font-weight: bold;
}

.js-count-particles{
font-size: 1.1em;
}

#stats,
.count-particles{
-webkit-user-select: none;
margin-top: 5px;
margin-left: 5px;
}

#stats{
border-radius: 3px 3px 0 0;
overflow: hidden;
}

.count-particles{
border-radius: 0 0 3px 3px;
}

/* —- particles.js container —- */

#particles-js{
width: 100%;
height: 100%;
background-color: #b61924;
background-image: url(”);
background-size: cover;
background-position: 50% 50%;
background-repeat: no-repeat;
}
i added js code in app.js

“particles”: {
“number”: {
“value”: 80,
“density”: {
“enable”: true,
“value_area”: 800
}
},
“color”: {
“value”: “#ffffff”
},
“shape”: {
“type”: “circle”,
“stroke”: {
“width”: 0,
“color”: “#000000”
},
“polygon”: {
“nb_sides”: 5
},
“image”: {
“src”: “img/github.svg”,
“width”: 100,
“height”: 100
}
},
“opacity”: {
“value”: 0.5,
“random”: false,
“anim”: {
“enable”: false,
“speed”: 1,
“opacity_min”: 0.1,
“sync”: false
}
},
“size”: {
“value”: 5,
“random”: true,
“anim”: {
“enable”: false,
“speed”: 40,
“size_min”: 0.1,
“sync”: false
}
},
“line_linked”: {
“enable”: true,
“distance”: 150,
“color”: “#ffffff”,
“opacity”: 0.4,
“width”: 1
},
“move”: {
“enable”: true,
“speed”: 6,
“direction”: “none”,
“random”: false,
“straight”: false,
“out_mode”: “out”,
“attract”: {
“enable”: false,
“rotateX”: 600,
“rotateY”: 1200
}
}
},
“interactivity”: {
“detect_on”: “canvas”,
“events”: {
“onhover”: {
“enable”: true,
“mode”: “repulse”
},
“onclick”: {
“enable”: true,
“mode”: “push”
},
“resize”: true
},
“modes”: {
“grab”: {
“distance”: 400,
“line_linked”: {
“opacity”: 1
}
},
“bubble”: {
“distance”: 400,
“size”: 40,
“duration”: 2,
“opacity”: 8,
“speed”: 3
},
“repulse”: {
“distance”: 200
},
“push”: {
“particles_nb”: 4
},
“remove”: {
“particles_nb”: 2
}
}
},
“retina_detect”: true,
“config_demo”: {
“hide_card”: false,
“background_color”: “#b61924”,
“background_image”: “”,
“background_position”: “50% 50%”,
“background_repeat”: “no-repeat”,
“background_size”: “cover”
}
i added code in function.php
function enfold_customization_custom_js() {
?>
<script type = “text/javascript” src = “http://test.jskindustrial.com/wp-content/themes/enfold-child/particles.js-master/particles.js-master/particles.js”></script&gt;
<script type = “text/javascript” src = “http://test.jskindustrial.com/wp-content/themes/enfold-child/particles.js-master/app.js”></script&gt;
<?php
}
add_action( ‘wp_footer’, ‘enfold_customization_custom_js’ );
but it show nothing in output

Hello!
I use among others the plugin WCFM (multivendor plugin). In it I wanted to make changes via the Enfold short CSS, but they do not take effect.
Do you have any ideas?
Concerns the the font size of the Vendor-headings in the store list. From H2 to H3
On this page: Link: https://portal.kijuaa.de/anbieter/uebersicht/

The WCFM support wrote me the following CSS code. But when I enter it – as usual – in Enfold-Quick CSS, nothing happens. The font size does not change.
Why?

best regards
Susanne

.page-id-6237 #top #wrap_all .all_colors h2 {
font-size: 20px;
}