For a team member using Meta Overlaid, Bio Modal... Is there a way to have the team member name and position always overlaid on mobile. Currently, when viewing from a desktop, the team member's name and position show upon hovering with the cursor over their image. On mobile, however, their name and position only show for a brief second when I select their image to read their bio. I would like their name and position to always be viewable on mobile without needing to select. Additionally, is there a setting to always have name and position permanently overlaid on both desktop and mobile?
Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.
That worked fairly well. I appreciate your response. Is there a way to change the spacing between the person's name and their title? I would like the two layers of text to be closer together. Also, is there a way to only apply the permanently visible name and position on mobile? I'm thinking probably not but I liked how the name scrolled in originally on desktop and would like it permanently shown on mobile. Thanks again for your help on this matter.
To make the changes as requested, you will need to add some custom CSS code. To do this, please follow these steps:
From your WordPress dashboard, Navigate to Salient > General Settings > CSS/Script Related. In the custom code area, insert the provided CSS snippet:
@media only screen and (max-width: 690px){
.team-member[data-style=bio_fullscreen] .team-meta h3 {
opacity: 1;
}
.team-member[data-style=bio_fullscreen] .team-meta p {
opacity: 1;
}
.team-member[data-style=bio_fullscreen] .team-meta h3 {
margin-bottom: -8px;
}
}
Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.
For a team member using Meta Overlaid, Bio Modal... Is there a way to have the team member name and position always overlaid on mobile. Currently, when viewing from a desktop, the team member's name and position show upon hovering with the cursor over their image. On mobile, however, their name and position only show for a brief second when I select their image to read their bio. I would like their name and position to always be viewable on mobile without needing to select. Additionally, is there a setting to always have name and position permanently overlaid on both desktop and mobile?
Hi there,
Thanks for writing to us.
To make the changes as requested, you will need to add some custom CSS code. To do this, please follow these steps:
From your WordPress dashboard, Navigate to Salient > General Settings > CSS/Script Related. In the custom code area, insert the provided CSS snippet:
.team-member[data-style=bio_fullscreen] .team-meta h3 { opacity: 1; } .team-member[data-style=bio_fullscreen] .team-meta p { opacity: 1; }Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.
That worked fairly well. I appreciate your response. Is there a way to change the spacing between the person's name and their title? I would like the two layers of text to be closer together. Also, is there a way to only apply the permanently visible name and position on mobile? I'm thinking probably not but I liked how the name scrolled in originally on desktop and would like it permanently shown on mobile. Thanks again for your help on this matter.
Hi there,
Thanks for writing back.
To make the changes as requested, you will need to add some custom CSS code. To do this, please follow these steps:
From your WordPress dashboard, Navigate to Salient > General Settings > CSS/Script Related. In the custom code area, insert the provided CSS snippet:
@media only screen and (max-width: 690px){ .team-member[data-style=bio_fullscreen] .team-meta h3 { opacity: 1; } .team-member[data-style=bio_fullscreen] .team-meta p { opacity: 1; } .team-member[data-style=bio_fullscreen] .team-meta h3 { margin-bottom: -8px; } }Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.
That's absolutely perfect. I am very grateful for your help and love the theme. Thank you so much!
Hi there,
You're welcome.
Please feel free to open a new ticket in case of any other queries.
Best Regards.