When I add block Social links in the template part and after that choose this template part with block Template part - nothing is rendering. Why it's happening? Maybe attributes don't pass trough blocks in this case? but it looks like a bug in the core.
<!-- wp:social-links -->
<ul class="wp-block-social-links">
<!-- wp:social-link /-->
</ul>
<!-- /wp:social-links -->
Or when I create a template part like this - is any possible way to pass dynamically attributes from the editor to template part instead hardcoded url?
<!-- wp:social-links -->
<ul class="wp-block-social-links">
<!-- wp:social-link {"url":"https://wordpress.org/patterns/","service":"instagram"} /-->
<!-- wp:social-link {"url":"https://wordpress.org/patterns/","service":"bandcamp"} /-->
<!-- wp:social-link {"url":"https://wordpress.org/patterns/","service":"twitter"} /-->
<!-- wp:social-link {"url":"https://wordpress.org/patterns/","service":"twitch"} /-->
I try to add block Social Links in the template part and need to have the opportunity to choose template part with social links with block Template Part. And seeing results on the frontend.
When the Social Links block is inserted into the template part, a valid link for each social you add, eg "Instagram", "Bandcamp", etc... is required otherwise it will not render a link on the frontend - producing the markup posted in your question.
To insert the Social Links block into multiple template parts without having to set the URLs each time, convert your configured Social Links block to a Reusable Block. By using a Reusable Block in your templates, you will also be able to easily update/add/remove your social links site-wide in the future if needed.
Related
When i create a new Post and write in the excerpt, the post image on the news page just dissappears . It only works if i have no excerpt. Also .. How can i create new posts with existing classes already written in my css?
Without the excerpt ir works just fine. Showing image and text that i add on the post.
My code
<section id="content">
<div class="content-wrap">
<div class="container clearfix">
<div class="row"> {% component 'blogPosts' %}
</div>
</div>
</div>
</section><!-- #content end -->
When not defining an excerpt, a summary attribute is appended to the model. See https://github.com/rainlab/blog-plugin/blob/master/models/Post.php#L344 . If your content starts with an image, it might be that the summary function kicks in and generates the image.
As for the CSS part
I think you're looking to override the partial set by {% componenent 'blogPosts' %}. As per the docs (https://octobercms.com/docs/cms/components#overriding-partials)
All component partials can be overridden using the theme partials. If
a component called channel uses the title.htm partial. We can override
the partial by creating a file in our theme called
partials/channel/title.htm.
Alternatively you can cmd / ctrl + doubleclick to expand the default component markup inside the CMS editor.
In this way you can edit your markup to match your theme.
If you want to override markup there is really easy way. for image #CptMeatball added proper answer you can check that out.
This way you have full control on mark-up and you can edit it.
1. Click on expand component it will reveal mark-up of component
2. Now you can add your own markup and edit it.
if any doubt please comment.
I need some help to understand how to create WordPress One Page Scroll website. I did a standard website before (the one that change content after clicking on menu link), but I can't figure out how to use WP on web page with scroll to section instead of standard sub-sites.
Let me show You structure of my site:
<!DOCTYPE html>
<head>
css/bootstrap
css/main.css
etc.
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" id="navbar">
//This navbar overlaps header and it's fixed to top//
//Has links to sections (e.g. #one, #two etc.)//
</nav>
<header class="masthead">
//This is also my "front page" displayed on page load with height:
100%, width: 100%//
</header>
<section id="one" class="bg-primary">
//first section to scroll to//
</section>
<section id="two" class="bg-primary">
//second section to scroll to//
</section>
//first section to scroll to//
<section id="three" class="bg-primary">
//third section to scroll to//
</section>
<footer id="main-footer" class="bg-primary">
//Some info about author, website, and social media links//
</footer>
js/jquery.min.js
js/bootstrap.min.js
js/script.js //my custom scripts
</body>
My problem is- how to organize this content for CMS to change every section content via dashboard?
1. Should I create different page.php for each section (e.g. page-one.php etc) and use:
<?php get_header(); ?>
<?php get_template_part('page-offer'); ?>
<?php get_template_part('page-tech'); ?>
<?php get_template_part('page-portfolio'); ?>
<?php get_template_part('page-contact'); ?>
<?php get_footer(); ?>`
on index.php
Or should I create section-one.php, section-two.php etc. and display it on "front-page.php"?
My second question is- is it possible to create different PHP file with Navbar code, and use this navbars html, and css as WordPress dashboard menu? Or should I create menu in dashboard first (every section is a single page) and then style it with custom css?
And last: How to use custom fields to edit every single paragraph, button content, link etc. via dashboard and allow it to work with POLYLANG to change content language?
Thanks for any help, and apologize for long thread. I'm realy struggling with this.
I'm new to Wordpress and PHP and this might be a dumb question, but I'm trying to link one of my menu items to one of the sections on my index page.
I know that if I just wanted to link it to the index I should use this:
<?php echo home_url(); ?>
But I want the link to send the user to the "About" section. Basically, I need to know how to do this:
index.php#about
but with PHP.
Thank you!
You're on the right track.
The ideal way to do this would be to add a <a name="about></a> tag to the appropriate section of your template. This is called an HTML anchor and is how those #tags know where to point to.
Given that this is Wordpress, you could probably also get away with just appending that to the title of the appropriate section. So wherever you specified 'call this section "About"', you could probably redo it as 'call this section "<a name="about">About</a>"' and then you'll be able to link to it using anchors like in your example-- About
If you are new to php, maybe you should use wordpress's editor ?
In your page (in the admin page), you can put any html you want.
In the editor, you can add custom links (with anchors or not) and you can put a div tag in the "html" tab.
So if you put your link at the top of your page and put your section in a div id="myanchor", it should do it !
You shouldn't do this with HTML or PHP but rather with JS. Specifically for long pages and require in-page navigation, I really like the scrollTo jQuery plugin.
In practice, you'll have some HTML containers that look something like this:
<!-- Your menu -->
<ul>
<li id="about-button"></li>
<li id="product-button"></li>
<li id="something-button"></li>
<li id="else-button"></li>
</ul>
<!--Your page sections-->
<main class="my-page">
<section id="about"></section>
<section id="product"></section>
<section id="something"></section>
<section id="else"></section>
</main>
Once you've included jQuery and the scrollTo plugin, you'll have some JS that looks like this:
$('#about-button').click(function() {
$.scrollTo($('#about'), {
duration: 800,
offset: -50
});
return false;
});
The JS is saying that once you click on the #about-button, take 800 milliseconds and animate the page down to -50px before the position of the #about HTML element. You could just setup a series of click functions for each button and you'd have a slick in-page nav system.
I tried to add a CTA to a WordPress site. I placed on the header and I added this HTML code to the header.php
<!-- This is my extra div element-->
<div class="extra-top"> <?php echo ' <a class="extra-topie" href="tel:6172010333">Call Us Now: (617) 201-0333</a> '; ?></div>
<!-- Ends extra div element-->
But the Anchor text is not working: it's not clickable yet.
For me work... But why you insert PHP echo if not use no variable?
Try this:
<!-- This is my extra div element-->
<div class="extra-top"><a class="extra-topie" href="tel:6172010333">Call Us Now: (617) 201-0333</a></div>
<!-- Ends extra div element-->
This suppose to work both the PHP and Direct HTML if you place it the right place.
If it is still not clickable, that mean you have issue with associated Application to handle dialer in Windows.. try from mobile and it should show its working.
Just tried that on my WordPress, it didn't work in desktop because I don't have default phone dialer ..but worked from mobile.
Just started learning WordPress, and I've run into a problem I can't figure out. I'm trying to use WP for the News section of my website. So I want to keep all my styles and structure, but add WP comments, archives, etc. The problem is that WP appears to be interpreting the DOM differently on the Archives page than on the homepage.
Here's what I intend the basic HTML structure to be with the WP elements added in:
<div id="wp-main">
<div class="news">
<div class="posts">
<p>POST CONTENT</p>
<div id="wp-comments>
<span>WP COMMENTS CONTENT</span>
</div><!-- #wp-comments -->
</div><!-- .posts -->
</div><!-- .news -->
</div><!-- #wp-main -->
.news has its opening tag in header.php, and closing tag before the footer in footer.php. .posts has its opening tag in content.php, and its closing tag after the comments in comments.php. This works great for the homepage:
But the archive page is producing nested .posts within the parent .posts, resulting in a russian-doll effect:
I know it's hard to pin-point a problem when you don't have access to all the code, but as you know, there's LOTS of it, so hopefully there is a wordpress expert out there, and I'm just making an obvious mistake :)
I figured it out, and I don't think anyone could've made this leap without much more information. In order to show the comments on the homepage I added this code to index.php (in the while loop):
$withcomments = "1";
comments_template();
Since my .posts ends AFTER the comments, I had to add that code to the while loop of archive.php as well. I didn't have the closing tag, since the comments weren't there.