Slider in Wordpress
up vote
-1
down vote
favorite
I want to make a slider in my custom wordpress theme (using understrap):
I tried using flexslider, had a problem where i could not target the .slides ul for whatever reason. i edited it in my _theme.scss and also tried in the flexslider.css
Why did it work in the inspector, but not in the css / scss files?
This was the first hurdle. The second is, i dont want to have dots below to see what picture i am viewing, i want to have lines , in the right-middle of the picture which shows on an active state the number of the picture currently viewing, for example picture 1 is viewed, show "1" next to the active line.
as this has become impossible to solve with my current skills i am asking you guys to help me out please.
i would use the bootstrap carousel, too. But i am unsure how to edit the above mentioned css to create the desired outcome.
I do not want to use a wordpress plugin as this limits me probably in my decisions. I cannot do "if active state "1" then write "1" next to the picture" or something like that, if you know what i mean.
sorry for putting it really general but thats all i can provide as i have only the non - working flexslider locally installed.
javascript css wordpress slider flexslider
asked Nov 17 at 22:03
Desory
41
add a comment |
up vote
-1
down vote
favorite
I want to make a slider in my custom wordpress theme (using understrap):
I tried using flexslider, had a problem where i could not target the .slides ul for whatever reason. i edited it in my _theme.scss and also tried in the flexslider.css
Why did it work in the inspector, but not in the css / scss files?
This was the first hurdle. The second is, i dont want to have dots below to see what picture i am viewing, i want to have lines , in the right-middle of the picture which shows on an active state the number of the picture currently viewing, for example picture 1 is viewed, show "1" next to the active line.
as this has become impossible to solve with my current skills i am asking you guys to help me out please.
i would use the bootstrap carousel, too. But i am unsure how to edit the above mentioned css to create the desired outcome.
I do not want to use a wordpress plugin as this limits me probably in my decisions. I cannot do "if active state "1" then write "1" next to the picture" or something like that, if you know what i mean.
sorry for putting it really general but thats all i can provide as i have only the non - working flexslider locally installed.
javascript css wordpress slider flexslider
asked Nov 17 at 22:03
Desory
41
add a comment |
up vote
-1
down vote
favorite
up vote
-1
down vote
favorite
I want to make a slider in my custom wordpress theme (using understrap):
I tried using flexslider, had a problem where i could not target the .slides ul for whatever reason. i edited it in my _theme.scss and also tried in the flexslider.css
Why did it work in the inspector, but not in the css / scss files?
This was the first hurdle. The second is, i dont want to have dots below to see what picture i am viewing, i want to have lines , in the right-middle of the picture which shows on an active state the number of the picture currently viewing, for example picture 1 is viewed, show "1" next to the active line.
as this has become impossible to solve with my current skills i am asking you guys to help me out please.
i would use the bootstrap carousel, too. But i am unsure how to edit the above mentioned css to create the desired outcome.
I do not want to use a wordpress plugin as this limits me probably in my decisions. I cannot do "if active state "1" then write "1" next to the picture" or something like that, if you know what i mean.
sorry for putting it really general but thats all i can provide as i have only the non - working flexslider locally installed.
javascript css wordpress slider flexslider
asked Nov 17 at 22:03
Desory
41
I want to make a slider in my custom wordpress theme (using understrap):
I tried using flexslider, had a problem where i could not target the .slides ul for whatever reason. i edited it in my _theme.scss and also tried in the flexslider.css
Why did it work in the inspector, but not in the css / scss files?
This was the first hurdle. The second is, i dont want to have dots below to see what picture i am viewing, i want to have lines , in the right-middle of the picture which shows on an active state the number of the picture currently viewing, for example picture 1 is viewed, show "1" next to the active line.
as this has become impossible to solve with my current skills i am asking you guys to help me out please.
i would use the bootstrap carousel, too. But i am unsure how to edit the above mentioned css to create the desired outcome.
I do not want to use a wordpress plugin as this limits me probably in my decisions. I cannot do "if active state "1" then write "1" next to the picture" or something like that, if you know what i mean.
sorry for putting it really general but thats all i can provide as i have only the non - working flexslider locally installed.
javascript css wordpress slider flexslider
javascript css wordpress slider flexslider
asked Nov 17 at 22:03
Desory
41
asked Nov 17 at 22:03
Desory
41
asked Nov 17 at 22:03
Desory
41
asked Nov 17 at 22:03
Desory
41
asked Nov 17 at 22:03
Desory
41
41
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
|
show 1 more comment
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
|
show 1 more comment
up vote
0
down vote
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
|
show 1 more comment
up vote
0
down vote
up vote
0
down vote
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
for instant solution you can use option tree plugin.which make the pictures dynamic with them you can use bootstrap slider.and replace image url option tree plugin code.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
answered Nov 17 at 22:13
ankit chauhan
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
answered Nov 17 at 22:13
ankit chauhan
32
answered Nov 17 at 22:13
ankit chauhan
32
32
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
ankit chauhan is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
|
show 1 more comment
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
I do not want to use a wordpress plugin
– j08691
Nov 17 at 22:15
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
that would ruin the smooth slider effect :/ the thing is, i dont want to use a wordpress plugin, because i want to a) learn, b) edit it myself to fit my needs, i want to have a horizontal carousel indicator in the middle of the screen. well i think with custom css thats an easier task and you dont rly need a plugin for this small stuff. im just not good enough yet
– Desory
Nov 17 at 22:19
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
can you please share slider example related to your slider.what kind of slider you want
– ankit chauhan
Nov 17 at 22:21
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
imgur.com/a/q96oUC9 , this is all i can provide. it should look like this, simple image in the background
– Desory
Nov 17 at 22:22
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
the question now is, how do i tell the flexslider more specific the : flex-viewport ul { } to have 0 padding on the left, because due to some never seen " padding-inline-start: 40px;" it is not in the right spot. those 40px cannot be changed it says "user agent stylesheet" in the inspector
– Desory
Nov 17 at 22:30
|
show 1 more comment
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53355963%2fslider-in-wordpress%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
